<a href onClick="return false;">不适用于Safari/iOS？

问题描述：

我有这样的代码在我的网页：<a href onClick="return false;">不适用于Safari/iOS？

<a href onClick="return false;">Press me!</a>

链接放置在跨度内有一个有用的onclick事件。

现在，在Chrome和Firefox中，这个功能完美无缺。链接被点击，有用的事件被执行，每个人都很高兴。在使用默认Safari浏览器的iOS（iPhone和iPad）中，这会失败 - 在点击链接之后，整个页面将被重新加载，并且永远不会执行有用的事件。

我也试过

<a href="#" onClick="return false;">Press me!</a>

我明白这是这样做的错误的方式。在Chrome和Firefox中它运行良好，但是在iOS的Safari中它跳回到页面的开头（但是它执行有用的事件，所以从某种意义上说它更好）。

我错过了什么？

答

从你的描述来看，它好像是iOS浏览器JS实现中的一个bug（也许创建一个最小代码来演示它？）。

一个简单的解决方法是将<a href...>替换为<span style="cursor:pointer;">。

这不是我希望的解决方案，但它似乎确实是iOS中的一个错误，并且解决方法奏效。 – 2012-04-14 19:51:45

答

你试过绑定纯粹从JavaScript的元素？

<a href="#" id="nogo">Foo</a> 

document.getElementById('nogo').onclick = function(ev) { 
ev.preventDefault(); 
};

这是一个有问题的解决方案，因为有很多这样的链接，它们是由一个更大的系统动态创建的（phpbb，就此而言，链接用于显示扰流文本）。 – 2012-04-14 09:52:10

啊不够公平，没有指定，所以不能猜测。你可以使用jquery吗？那么你可以用一个命令绑定它们，甚至新创建一个。 – GillesC 2012-04-14 09:53:38

我可以做一些黑客攻击，但我更愿意保持在规则之内，即提供一个html代码，它将替换消息中的破坏者标签，而不用使用viewtopic.php本身。我没有指定上下文，因为在我看来，这是一个问题，我不了解链接工作的基本方法。 – 2012-04-14 09:56:10

答

您可以设置href="#"，我注意到跳转到页面顶部。 #是一个页内定位符，我相信它指的是页面的顶部。我并不清楚所定义的行为。但是，唉，你想取消它。

在iPhone 5.0.1模拟器中，将取消方法组合起来并且不滚动到顶部。这是我完整的test.html文件。它可以在模拟器，Chrome和OS X Safari中运行。

<div style="height: 1000px; background-color: blue;"></div> 
<a href="#" onClick="event.preventDefault(); return false;">Poke it!</a> 
<div style="height: 1000px; background-color: red;"></div>

对于记录，删除event.preventDefault();重复您的错误。

谢谢，我没有考虑使用preventDefault。 – 2012-04-15 09:15:24

不适用于Safari/iOS？

相关推荐