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

Question

我的一个 AngularJS 应用程序有一个奇怪的问题。该应用程序使用 iCheck 来设置复选框的样式，问题是：当通过单击其标签选择复选框时，在手机上（或移动模拟器）时，与复选框相关联的事件是开枪两次。

我创建了一个 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. 单击标签选择其中一个复选框，您将在控制台日志中看到三个日志项：应用、已调用事件和更新

现在，让我们重现我正在尝试解决的问题：

1. 在移动模拟器中打开 JSFiddle（以 iPhone 6 为例）
2. 在开发人员工具栏中打开 javascript 控制台
3. 点击标签选择其中一个复选框，您将在控制台日志中看到五个日志项：应用、事件调用、更新、事件调用和更新

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

如您所见，将“事件调用”和“更新”记录到控制台的事件在使用移动设备时会触发两次。此外，未选中该复选框。有谁能够弄清楚为什么会发生这种情况？

谢谢！

Answer 1

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

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

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