2

ボタンのクリックで新しい行が追加される動的テーブルを作成していました。このテーブルには、 Deleteという列が含まれています。リンクの削除をクリックすると、対応する行が削除されます。しかし、私のjqueryは機能していません。

テーブルからエントリを削除するスニペットは次のとおりです。

$(".delRow").click(function()
                        {
                            alert("Called");
                             $(this).parents('tr').first().remove();


                        }
                    ); 

これがjsfiddle LINKです

更新:動的に追加されていない行を正常に削除できることに注意してください。動的に追加された行のリンク列の削除をクリックしても、アラートは呼び出されません。

4

3 に答える 3

4

.delRowページの読み込み時には が存在しないため、動的に作成された要素にイベント ハンドラをバインドするために使用する必要があります.on

この形式を使用するにonは、まず jQuery を使用して、イベント ハンドラーをバインドする要素の既存の静的な親を選択します。選択した親は、パフォーマンスを向上させるために、ターゲット要素にできるだけ近づける必要があります。次に、処理するイベントとターゲット要素のセレクターを指定します。最後に、イベント ハンドラーが提供されます。

            /*Remove Text Button*/
            $("#sample-table").on("click", ".delRow", function()
                {
                    $(this).parents("tr").remove();
                }
            ); 

作業例 http://jsfiddle.net/qRUev/2/

ドキュメンテーション

于 2013-07-16T09:18:38.230 に答える
2

使ってみて

$('.delRow').live('click', function (){
   alert("Called");
});

それ以外の

$(".delRow").click(function(){
   alert("Called");
});
于 2013-07-16T11:13:30.107 に答える
1

使用する必要があるかもしれません

$(document).on('click', ".delRow", function()
                    {
                        alert("Called");
                         $(this).parents('tr').first().remove();


                    }
                ); 

デモ:フィドル

于 2013-07-16T09:17:57.387 に答える