在 html 锚点中返回 false 不返回 false答案

【问题标题】：Return false in an html anchor isn't returning false在 html 锚点中返回 false 不返回 false
【发布时间】：2011-11-08 14:42:37
【问题描述】：

我正在尝试修复我的灯箱 Javascript 中的一个小错误，同时尽可能保持编辑不显眼。

示例页面： http://www.mattressonline.co.uk/Product/Silentnight-Miracoil-3-Gold-Label-Limited-Edition-Mattress-P43

问题在于主要产品图片。如果单击两个缩略图中的任何一个，图像将按预期加载到灯箱内。单击大图像会触发单击图库图像的事件，您可以看到灯箱开始弹出，但随后标记的默认事件会触发，并且图像会在单独的窗口中加载。这不应该发生，因为链接使用return false；

<a id="gallery-link" class="main" href="#" onclick="click($('gallery-image-0')); return false;" title="Gold Label Mattress">
    <img id="gallery-image" src="/content/products/280x175/silentnight-ariel-miracoil-gold-label-limited-edition.jpg" alt="Gold Label Mattress">
</a>

除此之外，它几乎只是一个标准的原型/scriptaculous/lightbox2 设置。

知道为什么 return false 不返回 false 吗？真是令人沮丧。

编辑：IE6 和 8 确实按照说明返回 false。当前的 Firefox、Chrome 和 IE9 不支持。

【问题讨论】：

标签： javascript prototypejs dom-events lightbox2

【解决方案1】：

在另一个具有自己的操作集的事件被触发后，您正试图返回 false。因此，您计划调用 return false，但在此之前，gallery-image-0 会响应您的 click() 调用，这可能已经导致浏览器打开另一个页面。

这有意义吗？因此，您需要在目标元素上观察click，并确保它以return false 或event.stop() 结尾。

【讨论】：

【解决方案2】：

不显眼的脚本通常意味着不使用内联属性。当前的最佳做法是在元素添加到 DOM 后附加侦听器：

$('gallery-link').observe('click', function(event) {
    click($('gallery-image-0'));
    event.stop();
});

【讨论】：

不幸的是，这样做会产生与在新窗口中加载图像相同的结果。仍然没有阻止默认事件。也就是说，我更改了您的代码以为 firebug 添加控制台日志，并发现在图像上单击 ONCE 会触发事件侦听器两次，这可能是它覆盖 return false 的原因？不幸的是 event.stop() 两次也不会停止默认事件。