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;
}
}
}