移动快速点击 – 防止幽灵焦点
我正在快速点击移动浏览器。 当我快速点击当前页面的链接时，它会对下一页执行ajax加载。 我的快速点击脚本可以立即停止鬼点击。 但是如果当前页面上的点击位置的下一页上有输入元素，它仍然会获得焦点并显示虚拟键盘。 如何防止鬼焦事件呢？
要防止与事件相关的操作，请使用.stopImmediatePropagation()和preventDefault() 。
工作演示
- stopImmediatePropagation（） – 调用它的同一函数内的处理程序将正常执行，但会立即忽略/停止与同一事件相关的其他函数内的任何操作。 例如：
// alert will fire $(document).on('click', '#foo', function(event) { event.stopImmediatePropagation(); alert('Hello world'); }); // but this will be stopped $(document).on('click', '#foo', function(event) { console.log('I am stopped!'); });
- preventDefault（） – 调用时，默认操作将被忽略。 例如
Google it!
该链接将被暂停，但会发出警报
$(document).on('click', '#foo', function(event) { event.preventDefault(); alert('I prefer MSN'); });
两者应该组合在一起，以阻止事件冒泡DOM树。
我做了一个演示来解释两者之间的差异以及为什么两者应该结合在一起。
基于以上所述，您的代码应如下所示。
$(document).on('click', '.selector', function (event) { event.stopImmediatePropagation(); event.preventDefault(); });
我希望这有帮助。
我正在使用fastclick.js。 这是我在下一页上阻止自动触发的方法：
全局CSS：
#preventClick { width:100%; height:100%; position:absolute; z-index:1000; top:0; left:0; }
下一页的HTML：
下一页的脚本：
function onDeviceReady() { setTimeout(function(){ $('#preventClick').hide(); }, 300); }
300是最低限度，没有任何意义
我已经花了一段时间来解决这个问题，但只找到了部分解决方案。 虽然我觉得这对我的问题来说已经足够了。 希望它对其他人也有帮助。
此解决方案基于jQuery mobile，但如果您不使用它，您可能可以执行类似的操作。
我所做的是，我放置一个空的div，在整个屏幕上填充其他元素，以便阻止（大多数）点击/触摸事件。
我在隐藏我正在改变的页面之前展示它。
$("div[data-role='page']").on("pagebeforehide", function() { $("#ghostBuster").show(); });
显示下一页后再次隐藏它。
$("div[data-role='page']").on("pageshow", function() { $("#ghostBuster").hide(); });
我没有彻底测试它，只在我的Android设备上，但到目前为止它似乎有助于避免鬼点击和聚焦。 它不适用于避免鬼点击选择框。 当页面之间的过渡动画非常快时，它不起作用。 我通过切换到jQuery mobile提供的非本机替代方案解决了选择框的问题。
您可能会考虑在mouseup上再次隐藏div，但这在我的情况下不起作用，因为我使用滑动来更改页面。
这可能不是最可能的解决方案，但到目前为止我一直无法找到或想出更好的解决方案。