好看的amazeui用户充值界面代码

好看的amazeui用户充值界面代码-精品资源网
好看的amazeui用户充值界面代码
此内容为免费资源,请登录后查看
0
免费资源

好看的amazeui用户充值界面代码

一款非常好看的基于amazeui用户充值界面代码,可以选择支付宝或者是微信付款方式来进行充值。当然这只是充值页面模板,充值功能还需要程序上实现。

js代码

<script type=\"text/javascript\" src=\"js/amazeui.min.js\"></script>
<script type=\"text/javascript\" src=\"js/ui-choose.js\"></script>
<script type=\"text/javascript\">
	// 将所有.ui-choose实例化
	$(\'.ui-choose\').ui_choose();
	// uc_01 ul 单选
	var uc_01 = $(\'#uc_01\').data(\'ui-choose\'); // 取回已实例化的对象
	uc_01.click = function(index, item) {
		console.log(\'click\', index, item.text())
	}
	uc_01.change = function(index, item) {
		console.log(\'change\', index, item.text())
	}
	$(function() {
		$(\'#uc_01 li:eq(3)\').click(function() {
			$(\'.tr_rechoth\').show();
			$(\'.tr_rechoth\').find(\"input\").attr(\'required\', \'true\')
			$(\'.rechnum\').text(\'10.00元\');
		})
		$(\'#uc_01 li:eq(0)\').click(function() {
			$(\'.tr_rechoth\').hide();
			$(\'.rechnum\').text(\'10.00元\');
			$(\'.othbox\').val(\'\');
		})
		$(\'#uc_01 li:eq(1)\').click(function() {
			$(\'.tr_rechoth\').hide();
			$(\'.rechnum\').text(\'20.00元\');
			$(\'.othbox\').val(\'\');
		})
		$(\'#uc_01 li:eq(2)\').click(function() {
			$(\'.tr_rechoth\').hide();
			$(\'.rechnum\').text(\'50.00元\');
			$(\'.othbox\').val(\'\');
		})
		$(document).ready(function() {
			$(\'.othbox\').on(\'input propertychange\', function() {
				var num = $(this).val();
				$(\'.rechnum\').html(num + \".00元\");
			});
		});
	})

	$(function() {
		$(\'#doc-vld-msg\').validator({
			onValid: function(validity) {
				$(validity.field).closest(\'.am-form-group\').find(\'.am-alert\').hide();
			},
			onInValid: function(validity) {
				var $field = $(validity.field);
				var $group = $field.closest(\'.am-form-group\');
				var $alert = $group.find(\'.am-alert\');
				// 使用自定义的提示信息 或 插件内置的提示信息
				var msg = $field.data(\'validationMessage\') || this.getValidationMessage(validity);

				if(!$alert.length) {
					$alert = $(\'<div class=\"am-alert am-alert-danger\"></div>\').hide().
					appendTo($group);
				}
				$alert.html(msg).show();
			}
		});
	});
</script>

© 版权声明
THE END
点赞0 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容