jQuery click事件不会在iPhone中的按钮元素上触发

Question

使用：

• Visual Studio 2013
• MVC5
• jQuery 1.10.2

在iPhone上不会调用<button>元素的.click（）事件。 在我的MVC项目中，所有<button>元素都是这种情况。 它已经在多部iPhone（iPhone 5和iPhone 6设备）上进行了测试，因此似乎并不是一个孤立的问题。

它也已经在装有Firefox，IE和Chrome的PC上进行了测试，并且可以按预期工作。 它还已经在Android设备和Windows Phone上进行了测试，并且.click（）事件可以正常工作。 我无法确定这是Safari，Safari Mobile，iPhone还是iOS问题。

我在Stack Overflow上发现有关iOS设备的讨论有时无法在本质上不可点击的元素上运行，除非您添加css样式以将光标变为指针（ cursor : pointer ）。 但是，此变通办法仍然不适用于<button>元素。

我认为值得一提的是，当使用锚标记（ <a> ）并设置其样式类似于按钮时，.click（）事件将在iPhone设备上触发。

有没有人经历过这种情况？ 我知道我可以将所有<button>元素更改为<a>标记，这是我必须要做的。 但是我想了解为什么会这样，如果我正在做某件事导致该问题。 非常感谢。

以下是我正在使用的标记和jquery代码的片段：

 $(document).ready(function () { $('#taskContainer').on('click', '#btnSave', function (event) { console.log('save button clicked'); }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <div id="taskContainer"> <button id="btnSave" class="btn btn-primary">Save</button> </div> 

Answer 1

在点击触发器的末尾使用return false：

$('#taskContainer').on('click', '#btnSave', function (event) {
    console.log('save button clicked');
    return false;
});