1

我对跨浏览器本机事件与回调事件有疑问。

我有一个带有给定href="". 我在dom:loaded这个链接上附加了一个函数（做 Ajax Stuff）。

JavaScript 代码在页面末尾加载以遵循 YSlow 建议。

问题：

如果你加载这个页面真的很快（按 F5）然后点击链接然后

  • 不alert()叫
  • 链接被关注（重新加载页面）

当服务器滞后时会发生这种情况。实际上页面还没有完成加载，浏览器执行代码。

演示：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
  </head>
  <body>

    <a href="#toolate" id="action">Click Me</a>

    <!-- According to YSlow Recommandation load at the bottom -->
    <script src="../js/lib/prototype.js" type="text/javascript" language="JavaScript"></script>
    <script>
      /* <![CDATA[ */
      document.observe('dom:loaded', function() { 
        $('action').observe('click', function(event){ alert("click"); Event.stop(event); });
      });
      /* ]]> */
    </script>
  </body>
</html>

转身：

一个转身是添加onClick="return false;"：

<a href="#toolate" id="action" onClick="return false;">Click Me</a>

它适用于滞后，但不适用于快速点击。而且我不喜欢这种转身，因为我的目标是消除onclick所有<a href="">

4

3 回答 3

1

你可以看看这个：

JQuery 有一个方便的小功能，它可以在文档对象模型准备好后立即启动您的 javascript……这发生在页面完成加载之前。

$(document).ready(function(){   //
 Your code here... 
});

通过

您还可以在页面加载时在所有内容前面放置一个大的禁用 div 以禁止单击，但我不推荐它。

不知道我的问题是否正确，如果我没有，请告诉我

于 2009-08-03T16:10:00.227 回答
1

我们已经在许多浏览器上对我们的 CMS 进行了许多测试。

按速度排序：

  1. JavaScript 在真正快速的点击之前无法执行
  2. onclick="return false" 在大多数情况下都可以正常工作
  3. JavaScript 做 2.) onLoad 太慢但可能足够
  4. DIV 用作屏蔽会带来其他问题，并不是一个好的选择
于 2012-08-03T19:44:57.317 回答
-1

看起来你手头的东西很好，你要做的就是创建一些链接，这些链接在不可能优雅降级的区域中什么都不做。

在这些情况下，我建议使用以下格式的链接：

<a href="javascript:void(0);">Linktext</a>

在启用或禁用 javascript 的情况下，此链接在功能上应该完全没有任何作用。

重要笔记

  1. 空隙中的数字零是绝对必要的。否则 Internet Explorer 会抱怨。
  2. “javascript:void(0);”的使用 微软强烈反对，因为可能会发生奇怪的事情。为避免大多数错误，请不要在 void(0) 链接中包含除文本之外的任何内容。
  3. 在您做出决定之前，请务必仔细考虑是否添加“javascript:void(0);” 确实是比添加返回 false 的 onclick 更好的解决方案。

删除 href 属性时：

从链接中删除 href 属性是有效的 XHTML。尽管是有效的 XHTML，您的链接将失去其自动链接样式。如果链接被访问，则不再有下划线、颜色、悬停和自动颜色更改。

由于 Internet Explorer 中对 :hover 的支持参差不齐，您也无法使用 CSS 解决样式不足的问题。

于 2009-08-05T14:35:10.803 回答