1

クロスブラウザのネイティブイベントとコールバックイベントに問題があります。

与えられたHTMLリンク「ClickMe」がありますhref=""。このdom:loadedリンクに関数をアタッチします(Ajaxスタッフを実行するため)。

YSlow Recommandationに従うために、JavaScriptコードがページの最後にロードされます。

問題

このページを非常にすばやくロードする場合(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);」の使用 奇妙なことが起こる可能性があるため、Microsoft はこれを強くお勧めしません。バグの大部分を回避するには、void(0) リンクでテキスト以外をラップしないでください。
  3. 決定を下す前に、「javascript:void(0);」を追加するかどうかを慎重に検討してください。falseを返すonclickを追加するよりも、実際には優れたソリューションです。

href 属性を削除する場合:

リンクから href 属性を削除することは有効な XHTML です。有効な XHTML であるにもかかわらず、リンクは自動リンク スタイル設定を失います。リンクにアクセスした場合、下線、色、ホバー、および自動色変更はもうありません。

Internet Explorer での :hover のサポートがむらがあるため、CSS でスタイルの欠如を修正することはできません。

于 2009-08-05T14:35:10.803 に答える