0

テーブルから行を削除し、ユーザーがフォームで編集を行った後に再挿入しています。問題は

class="view_dialog"

挿入された行に対して「ロード」されません。

元の行のレイアウトは次のとおりです。

<tr>
    <td>new one</td>
    <td>B2B NFIB</td>
    <td class="actions" id="actions">
       <a href="/dirs/edit/252" class="view_dialog">Edit</a>
    </td>
</tr>

ユーザーが何かを変更したら、すべての行 (通常は 4 つのうち 3 つだけ) を削除し、jquery を使用してテーブル (.records) にデータを入力します。

$('.records tbody tr:last').after('<tr><td>'+data.dirArray[$count].Dir.name+'</td><td>'+data.dirArray[$count].Dir.dir_description+'</td><td class="actions" id="actions"><a href="/dirs/edit/'+data.dirArray[$count].Dir.id+'" class="view_dialog" id="Edit'+data.dirArray[$count].Dir.id+'">Edit</a></td></tr>');

行は問題なく作成され、行に対して生成されたコードは元のコードと同じです (.addClass を使用しようとして id を追加しても問題ありません)。

<tr>
    <td>new one</td>
    <td>B2B NFIB</td>
    <td class="actions" id="actions">
        <a href="/dirs/edit/252" class="view_dialog" id="Edit252">Edit</a>
   </td>
</tr>

クラスが「ロード」されないのはなぜですか。そのクラスを使用して、いくつかのイベントをトリガーしています。

試した

$("[id^=Edit]").addClass('view_dialog'); 

結果なしに。

.live をチェックしましたが、親子コントロールに関係しています。この場合、使用は必須ですか?

手伝ってくれますか?

どうもありがとう !

4

2 に答える 2

0

クリック バインディングは、作成時に DOM にある要素にのみ適用され、後で追加される要素には適用されません。動的に追加された要素を処理するには、次のように委任する必要があります。

$(".records").on("click", ".view_dialog", function() {
    alert('class clicked');
});
于 2012-10-02T02:06:47.370 に答える
-1

コードをDOMReadyイベントで囲みましたか

$(function() {

   // You code 
   $("[id^=Edit]").addClass('view_dialog'); 

});

また、クラスを追加するのはいつですか。要素を作成する前または作成した後です。

要素が作成される前にこれを割り当てている場合、これは新しく追加された要素の場合には役に立たないのではないかと思います。

新しく作成された各要素にクラスを明示的に追加する必要があります。

于 2012-10-02T00:47:32.620 に答える