0

私は本当に jQuery に慣れていないので、ボタンが押されたときにこのコードで警告ボックスを表示したいと考えています。

<script src="https://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$("button").click(function() {
    alert("You clicked.");
});
</script>
<button>Button</button>

試してみましたが、ボタンをクリックしても何も起こりません。

4

5 に答える 5

6

jQuery では、イベント ハンドラーが追加されたときに、要素が既に dom にロードされていることを確認する必要があります。そうしないと、jQuery セレクターが要素を返さないため、イベント ハンドラーが登録されません。

解決策は、最初の DOM の読み込みが完了するとトリガーされる dom Ready イベント ハンドラーを使用することです。つまり、ページ内のすべての要素が DOM に読み込まれます。これは、イベント ハンドラーを追加する最も安全な場所です。

jQuery(function($){
    $("button").click(function() {
        alert("You clicked.");
    });
})

以下で @zzzzBov が指摘したように、これは長いドキュメント準備完了ハンドラーを使用するためのショートカットです。

jQuery(document).ready(function($){
    $("button").click(function() {
        alert("You clicked.");
    });
})
于 2013-09-13T00:48:37.550 に答える
3

現時点では、コードの実行時にボタンがロードされていないため、クリック ハンドラーは何もアタッチされていません。したがって$(document).ready(function() { ... });、ハンドラーをアタッチする DOM 要素が確実に存在するように、jQuery コードをラップする必要があります。コードは次のようになります。

$(document).ready(function() {
    $("button").click(function() {
        alert("You clicked.");
    });
});

$(document).ready() のドキュメントを参照してください。

于 2013-09-13T00:49:36.297 に答える
2

readyコードをイベントに入れる

$(document).ready(function(){
    $("button").click(function() {
        alert("You clicked.");
    });
});
于 2013-09-13T00:49:42.507 に答える
0

宣言する前にjQueryを呼び出してクリックハンドラーを追加している<button>ため、jQueryはそれを見つけられません。をスニペットの先頭に移動するか<button>、DOM Ready 関数を使用して、DOM を操作する準備ができるまでスクリプトの実行を遅らせます。

このような：

$(document).ready(function() {
  $("button").click(function() {
    alert("You clicked.");
  });
});
于 2013-09-13T00:51:35.883 に答える
0

ボタンが存在する前にそのスクリプトを実行しているので、代わりに後に配置します。

<script src="https://code.jquery.com/jquery-1.9.1.js"></script>

<button>Button</button>
<script>
$("button").click(function() {
    alert("You clicked.");
});
</script>
于 2013-09-13T00:52:54.170 に答える