zoukankan      html  css  js  c++  java
  • 使用WeUI+JS 的label包含input触发两次的问题

    在给原生JS中的包含input标签的Label标签绑定点击的事件会触发两次。

    因为使用WeUI样式库,所以不能抛弃label标签,使用event.stopPropagation()似乎没有效果,使用return false 亦没有效果。

    1.扩展绑定事件

    jQuery.WY = {
        bindMobileClick: function (selector, fn) {
            var touch = ('ontouchstart' in window) || window.DocumentTouch && document instanceof DocumentTouch;
            var fName = touch ? "tap" : "click";
            $(selector).on(fName, function (event) {
                fn(this);
                event.preventDefault();
                event.stopPropagation();
            });
        }
    }

    2.WeUI 样式表单

    <label class="weui-cell weui-check__label" for="rdCpfzt_20">
        <div class="weui-cell__bd">
            <p>微膨胀</p>
        </div>
        <div class="weui-cell__ft">
            <input type="checkbox" class="weui-check" name="rdCpfzt6" value="20" data-type="6" data-name="微膨胀" 
                id="rdCpfzt_20" >
              <span class="weui-icon-checked"></span></div>
    </label>

    3.绑定事件,使用时间戳限制

                var evTimeStamp = 0;
                $.WY.bindMobileClick(".weui-check__label", function (sender) {
                    var now = new Date();
                    if (now - evTimeStamp < 100) {
                        return;
                    }
                    var radio = $(sender).find(":radio");
                    radio.prop("checked", function (i, val) {
                        return !val;
                    });
    
                    var checkbox = $(sender).find(":checkbox");
                    checkbox.prop("checked", function (i, val) {
                        return !val;
                    });
    
                    evTimeStamp = now;
                });
  • 相关阅读:
    一个php soap的错误记录
    Android 开发有哪些新技术出现?
    每个PHP开发者都应该看的书
    30 个 PHP 的 Excel 处理类
    PHP Session可能会引起并发问题
    PHP代码优化技巧大盘点
    分析和解析PHP代码的7大工具
    关于 PHP 7 你必须知道的五件事
    PHP也20岁了
    PHP高级特性二之文件处理
  • 原文地址:https://www.cnblogs.com/sky-gfan/p/8472021.html
Copyright © 2011-2022 走看看