1 
<table class="table lsttabl">
    <thead>
    <tr>
        <th><div id="NameLabel">Customer Name</div></th>
        <th>Email</th>
        <th>Registered</th>
        <th id="Date1Label">Created Date</th>
        <th id="Date2Label">Last Updated Date</th>
        <th id="Date3Label">Expiry Date</th>
        <th id="UserCountLabel">User Count</th>
        <th>Active</th>
        <th>Configure</th>
        <th>Edit</th>
    </tr>
    </thead>

    <tbody> 
    </tbody>
</table>

そして、私は以下のコードを使用してイベントをバインドしようとしています

$("#NameLabel").click(function () { alert("hello"); });

多くのバリエーションを試しましたが、機能しません。知識を共有してください。

4

6 に答える 6

4

ページの読み込み後にこのコードが動的に追加される場合は、デリゲート関数を使用する必要がある場合があります。

$('body').delegate('click','#NameLabel',function(){
  alert("hello");
});

ここではbody、ページがロードされたときにbody要素がそこにあったことを確認できるため、セレクターを使用しています。動的コンテンツをロードする別の親要素がある場合は、イベントを本文にアタッチする代わりにそれを使用できます。

于 2012-12-07T12:15:28.150 に答える
2

スクリプトでアクセスする前に要素が使用可能であることを確認するために、 document.readyでバインドする必要があります。

ライブデモ

$(document).ready(function(){

   $("#NameLabel").click(function () {
          alert("hello");
   });

});
于 2012-12-07T12:13:45.487 に答える
2

次のことを試してください。

$(document).ready(function(){
    $('table.lsttabl thead th div[id$=NameLabel]').click(function(){
    alert("hii");
    });
});
于 2012-12-07T12:14:26.543 に答える
2

試す：

$(document).ready(function(){
    $('table').on('click', 'th', function(){
        console.log(event.target);
    });
});

特に#NameLabel専用にする場合は、onセレクターを「#NameLabel」に変更します。

于 2012-12-07T12:18:00.483 に答える
2 
<script type="text/javascript">
    $(document).ready(function () {
        $('#NameLabel').click(function () {
            alert("Customer Name Clicked");
        });
    });
</script>
<table class="table lsttabl">
    <thead>
    <tr>
        <th><div id="NameLabel">Customer Name</div></th>
        <th>Email</th>
        <th>Registered</th>
        <th id="Date1Label">Created Date</th>
        <th id="Date2Label">Last Updated Date</th>
        <th id="Date3Label">Expiry Date</th>
        <th id="UserCountLabel">User Count</th>
        <th>Active</th>
        <th>Configure</th>
        <th>Edit</th>
    </tr>
    </thead>

    <tbody> 
    </tbody>
</table>

JQueryライブラリをインポートすることを忘れないでください。

于 2012-12-07T12:22:23.347 に答える
0

あなたはこれを使うことができます

これが動作するjsfiddleですhttp://jsfiddle.net/9PNk6/

$("#NameLabel").on('click',function () {
   alert("hello");
});
于 2012-12-07T12:16:22.200 に答える