使用iScroll时input复选框/输入框不能选中解决方法

原因：由于iscroll要监听鼠标事件和触摸事件来进行滚动，所以禁止了浏览器的默认行为。

解决办法如下，由于iScroll5和4源码变化较大，所以处理方式有点不同，但是大致解决办法是一样的：

方法一（元素排除法）：
iScroll5版本：
源码中找到事件方法handleEvent: function (e) {}；
其中对click的监听方法阻止冒泡做修改，注释部分打开即可

//case 'click':
if ( this.enabled && !e._constructed ) {
//使用iScroll时input复选框不能选中解决方法
// var target = e.target;
// while (target.nodeType != 1) target = target.parentNode;
// if (target.tagName != 'INPUT')
// e.preventDefault();
// e.stopPropagation();

e.preventDefault();
e.stopPropagation();
}

 

iScroll4版本：
源码中找到onBeforeScrollStart: function (e) { e.preventDefault(); }；
替换为：

onBeforeScrollStart: function (e) {
//使用iScroll时input复选框不能选中解决方法
var target = e.target;
while (target.nodeType != 1) target = target.parentNode;
if (target.tagName != 'INPUT')
e.preventDefault();
}；

 

方法二（参数设置）：
iScroll5版本：
参数中preventDefault: true 修改为 preventDefault: false即可，但是此方法是处理了所有的冒泡传递事件，虽然也可解决当前问题；
但是会对iscroll设计初衷流畅度有所影响

方法三（判断排除法，类似于方法一）：
iScroll5版本：
源码中添加一句话&& !utils.preventDefaultException(e.target, this.options.preventDefaultException)，
源码中找到事件方法handleEvent: function (e) {}；
其中对click的监听方法阻止冒泡做修改，注释部分打开即可

case 'click':
if ( this.enabled && !e._constructed && !utils.preventDefaultException(e.target, this.options.preventDefaultException)) {
e.preventDefault();
e.stopPropagation();
}
break;

 

转自：https://blog.csdn.net/xw505501936/article/details/51886018