1

HTMLファイル:

<html>
    <head>
    </head>  
    <body>
        <script src="jquery.min.js"></script>
        <script src="popup.js"></script>
        <div id="clickem">click me</div>
    </body>
</html>

popup.js:

$("#clickem").click(function() {
    alert("I was clicked.");
});

うーん...だから私がそれをしているときは何も起こっていない。

4

6 に答える 6

3
$(document).ready(function(){
 $("#clickem").click(function() {
     alert("I was clicked.");
 });
});

コードをでラップしますdocument.ready

于 2013-03-01T11:58:23.447 に答える
1

DOMreadyイベントを使用します。

$(function(){
    $("#clickem").click(function() {
        alert("I was clicked.");
    });
});

<div id="clickem">click me</div>DOMにクエリを実行しても、まだレンダリングされていません。
関数をjQueryの「コンストラクター」に送信すると、DOMの準備ができたときに関数が実行されます。

$( function() { });と同等$(document).ready( function() { });です。
したがって、両方を使用できます。

于 2013-03-01T11:58:35.553 に答える
0

何も起きていない

クリックイベントは、DOM要素の準備ができる前に呼び出されるためです。そのため、idの要素を見つけることができませんclickem。準備完了関数内でスクリプトを呼び出す

$(function(){
   $("#clickem").click(function() {
     alert("I was clicked.");
   });
});

これにより、DOMの準備ができた後にスクリプトが呼び出されるため、クリックイベントが要素を見つけて、アラートを出すことができるようになります。

常にready関数内にスクリプトを書くことをお勧めします...

于 2013-03-01T11:59:32.200 に答える
0

ドキュメントの準備ができたらアクションを設定する必要があります

$(document).ready(function(){
 $("#clickem").click(function() {
    alert("I was clicked.");
 });
})
于 2013-03-01T11:59:49.320 に答える
0

これpopup.jsは、DOMが要素のロードを完了する前にファイルが実行されていることが原因である可能性があります。

したがって、セレクターのクリックイベントハンドラーは#clickemアイテムを検出しませんでした。

イベントハンドラーを$(document).ready()関数でラップすることにより、DOMがロードを完了したことを確認します。

$(document).ready(function(){
   $("#clickem").click(function() {
       alert("I was clicked.");
   });
});

ライブデモ: http: //jsfiddle.net/XfFu8/

于 2013-03-01T12:00:09.040 に答える
0

クリックイベントをバインドするとき、#clickemはDOMに存在しません。イベントをそれらの任意の要素.on()にバインドするために使用します。この場合、を使用する必要はありません。current or futuredocument$(document).ready()

popup.js

var onClickEm = function() {
    alert("I was clicked.");
};

$(document).on('click', '#clickem', onClickEm);

もう1つのオプションは、javascriptファイルのロードを延期することです。

<html>
    <head>
    </head>  
    <body>
        <script src="jquery.min.js"></script>
        <script src="popup.js" defer></script>
        <div id="clickem">click me</div>
    </body>
</html>

Defer、存在する場合、ページの解析が終了したときにスクリプトが実行されることを指定します。

于 2013-03-01T12:03:17.577 に答える