使用 iCheck - 事件在手机上调用两次

Question

我的一个 AngularJS 应用程序出现了一个奇怪的问题。该应用程序使用 iCheck 来设置复选框的样式，问题是：通过单击标签选择复选框时，在移动 phone（或移动模拟器）上时，绑定到复选框的事件被触发两次。

我创建了一个 JSFiddle，您可以在其中自己重现问题：https://jsfiddle.net/o6oewfff/22/

 <input data-icheck data-ng-model="product.selected" id="{{product.id}}" type="checkbox" data-ng-change="callAnEvent()" />

首先，看看它应该如何工作：

1. 在浏览器中打开 JSFiddle
2. 在您的开发者工具栏中打开 javascript 控制台
3. Select复选框之一点击标签，您将在控制台日志中看到三个日志项：应用、事件调用和更新

现在，让我们重现我要修复的问题：

1. 在移动模拟器中打开 JSFiddle（例如尝试 iPhone 6）
2. 在您的开发者工具栏中打开 javascript 控制台
3. Select 复选框之一 通过单击标签 ，您将在控制台日志中看到 五个 日志项: 应用、事件调用、更新、事件调用和 更新

截图：http://i.stack.imgur.com/7j03S.png

如您所见，使用移动设备时，将 'event called' 和 'update' 记录到控制台的事件会触发两次。此外，复选框未选中。有谁能弄清楚为什么会这样？

谢谢！

Answer 1

试试这个https://jsfiddle.net/scdmuout/

我在下面添加了阻止它在触摸和点击时触发

event.preventDefault();
event.stopPropagation();