基于amazeui的充值界面

所属分类:UI-布局

基于amazeui的充值界面 ie兼容9

使用方法

插件是基于amaze-ui写的,写之前先引入:

<link rel="stylesheet" type="text/css" href="css/amazeui.min.css" />
<script type="text/javascript" src="js/jquery-2.1.3.min.js"></script>
<script type="text/javascript" src="js/amazeui.min.js"></script>

美化radio:

<script type="text/javascript" src="js/ui-choose.js"></script>
// 将所有.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())
}		

提示信息:

data-validation-message="xxxxxxxxxxxxxxx"   //控制验证提示内容,写入input里即可。
$(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();
	}
    });
});
相关插件-布局

伸展式弹出页面

点击导航后弹出层为伸展式打开
  布局
 10780  122

Flat Tech html5模板 Bootstrap 响应式网站前端源码

一个优秀的展示网站为你产品的销售带来更多的亮点,模板简单明了的,只需要简单的更换内容,你的网站就可以直接上线运营
  布局
 12076  243

jquery流程设计器

jquery流程设计器
  布局
 28026  130

仿国外Tool网站

这个插件主要是仿Tool网站来写,里面主要是做一些动画效果,用css3和jQuery来写,未使用任何外部插件
  布局
 7781  30

讨论这个项目(13)回答他人问题或分享插件使用方法奖励jQ币

    1 0
    2018/7/6 12:12:31
    有没有办法取消选中状态呢。 回复
    默丶 0
    2018/5/17 20:29:07
    庞嗷嗷 0
    2018/5/3 18:33:53
    这个docVlGender=&radio1= 通过什么去取值 表单提交时取值取不到啊 回复
    215359721 0
    2018/3/7 15:04:22
    S&P 0
    2018/2/8 1:03:22
    我把这个和其他的demo整合之后发现页面有时候会自动刷新能不能帮我看看 多谢
        19930
        2018/2/8 8:40:42
        插件本身所用到的东西很少,逻辑也很简单,或者是与amazeui的验证表单有冲突吧。
        S&P0
        2018/2/8 11:33:43
        我知道了 因为那个提交按钮时submit 把它改成button就好了 细节错误好可怕
    回复
    老表 0
    2018/1/17 14:51:17
    九江老乡
        19930
        2018/1/18 10:34:28

        哈哈

    回复
    登录账号 0
    2018/1/2 20:11:15
    Maple_Jade 0
    2017/12/25 15:05:33

    其他金额输入带小数时显示错误,如输入15.75,下方显示 15.75.00

        19931
        2017/12/25 16:06:13
        <input type="number" min="10" max="10000" value="10.00元" class="othbox" onkeyup="this.value=this.value.replace(/\D/g,'')" data-validation-message="充值金额范围:10-10000元" />

        在输入框中添加正则:只允许正整数且不能带有小数点。

        $(document).ready(function() {
            $('.othbox').on('input propertychange', function() {
                var num = $(this).val();
                $('.rechnum').html("¥" + parseFloat(num));
            });
        });

        变量‘num’用parseFloat()包裹;

    回复
    雪利网络 0
    2017/12/25 8:43:45
取消回复