mui 的 checkbox 点击无效(与 ionic 的冲突)

引入 <script src="https://cdn.bootcss.com/ionic/1.3.2/js/ionic.bundle.js"></script> 后,mui 自己的 checkbox 点击无效。
通过 Event Listeners 分析后发现,在 ionic.bundle.js 的约第 2956 行的 tapClickGateKeeper 方法中冲突。


解决

function tapClickGateKeeper(e) {
        //console.log(e, e.target.type);
        // console.log('click ' + Date.now() + ' isIonicTap: ' + (e.isIonicTap ? true : false));
        if (e.target.type == 'submit' && e.detail === 0) {
            // do not prevent click if it came from an "Enter" or "Go" keypress submit
            return null;
        }
        //mui的checkbox的冲突解决
        if(e.target.type === 'checkbox' && e.target.parentElement.className.indexOf('mui-checkbox') !== -1){
        }else{
            // do not allow through any click events that were not created by ionic.tap
            if ((ionic.scroll.isScrolling && ionic.tap.containsOrIsTextInput(e.target)) ||
                (!e.isIonicTap && !ionic.tap.requiresNativeClick(e.target))) {
                //console.log('clickPrevent', e.target.tagName);
                e.stopPropagation();
                if (!ionic.tap.isLabelWithTextInput(e.target)) {
                    // labels clicks from native should not preventDefault othersize keyboard will not show on input focus
                    //和mui冲突,卧槽啊
                    e.preventDefault();
                }
                return false;
            }
        }
    }
返回文章列表 打赏
本页链接的二维码
打赏二维码
期待你的评论