2

mysqlクエリを実行するスクリプトがあり、を使用してテーブルにデータを入力します

  $('#results').html(returnData);

mysqlの結果には、クリックして同じテーブルに再ロードする必要があるデータが含まれています(前のクエリを置き換えます)。

単純化して煮詰めると、次のコードは機能しません。

   <head>
    <script>
    $(document).ready(function() {
        $('.a').click(function() {
            $('#results').html('THIS IS VALUE FROM LINK A <a href="#" class="b">B</a>');
        });

        $('.b').click(function() {
            $('#results').html('THIS IS VALUE FROM LINK B');
        });
    });​
    </script>
    </head>
    <body>
    <div id="results">THIS WILL BE REPLACED WITH VALUE FROM LINK A OR B</div><BR>
    <a href="#" class="a">LINK A</a><BR>
    <a href="#" class="b">LINK B</a>

リンクAまたはBをクリックするdiv id="results"と、入力はOKですが、.htmlクリック関数から返された結果の1つに同じリンクを配置すると、リンクが機能せず、divid"results"が再ロードされません。

だから私の質問は; なぜそれがうまくいかないのでしょうか?そして、すでに渡されたテーブル内でクリックしたものに基づいて、同じテーブルをリロードするための最良の方法は何でしょう.html()か?クリックした値を新しいページに渡したくありません。

更新:これは.on()を使用して機能します

<script>
$(document).ready(function(){

$('body').on('click', '.a', function() { 
    $('#results').html('THIS IS VALUE FROM LINK A <a href="#" class="b">B</a>');
});

$('body').on('click', '.b', function() { 
    $('#results').html('THIS IS VALUE FROM LINK B');
});

});
</script>

</head>

<body>
<div id="results">THIS WILL BE REPLACED WITH VALUE FROM LINK A OR B</div><BR>
<a href="#" class="a">LINK A</a><BR>
<a href="#" class="b">LINK B</a>
4

3 に答える 3

0

これを試して ::

  $('#results').find('.a').click(function() {
        $('#results').html('THIS IS VALUE FROM LINK A <a href="#" class="b">B</a>');
    });

   $('#results').find('.b').click(function() {
        $('#results').html('THIS IS VALUE FROM LINK B');
    });
于 2012-12-04T09:16:50.083 に答える
0
<html>
<script>
$(document).ready(function(){

    $('.a').live("click", function(e) {
        e.preventDefault();
        $('#results').html('THIS IS VALUE FROM LINK A <a href="#" class="b">B</a>');
    });

    $('.b').live("click", function(e) {
        e.preventDefault();
        $('#results').html('THIS IS VALUE FROM LINK B');
});

});
</script>

<div id="results">THIS WILL BE REPLACED WITH VALUE FROM LINK A OR B</div><BR>
<a href="#" class="a">LINK A</a><BR>
<a href="#" class="b">LINK B</a>

live()を使用して、新しく作成された要素にイベントをバインドし続けます。

于 2012-12-04T09:37:19.290 に答える
0

Abhilashのコメントを詳しく説明すると、クリックイベントが発生しない理由は、onReadyの実行時に現在DOMに存在する要素にのみイベントリスナーがアタッチされているためです。

.live()は、この問題に対処するために、古いバージョンのjQueryで導入されました(現在は.on()を優先して非推奨になっています)。これにより、bodyなどの静的要素にイベントをアタッチでき、クリックイベントがbodyまで伝播すると、イベントをトリガーした元のターゲット要素を.on()セレクターと照合し、一致する場合はハンドラーを実行します。

于 2012-12-04T09:22:17.943 に答える