3

私のプロジェクトでは、を使用してテーブルとデータベースから行を削除する関数に取り組んでいます.ajax()。ユーザーが削除ボタンをクリックしたときの関数を作成しました。理解できるように、いくつかの行があり、すべての行に独自の削除ボタンがあります。

これで、ユーザーがそれらの1つを初めてクリックすると、アイテムを削除することに確信があるかどうかを尋ねるポップアップモーダルが表示されます。[はい]をクリックすると、ポップアップが消え、行がフェードアウトします。これはすべて完璧に機能しますが...

ページを更新せずに2番目の削除ボタンをクリックすると、JavaScriptは現在要求されている削除（およびid）+前の削除を開始します。3回目に行うと、現在の1つと前の2つが起動します。

現在のを空にしようとしましたが、 success関数が起動var $(this).attr('data-page-id');されても同じことを行います。.ajax()

$('a.btn-page-delete').click(function() {

    var curPageId = $(this).attr('data-page-id');

    $('#delete-page').modal('show');

    $('a#action-confirm').click(function() {

        $.ajax({

            type       : 'POST',
            url        : '/pages/async/delete',
            dataType   : 'json',
            data       : { page : curPageId },
            success    : function(data) {

                $('#delete-page').modal('hide');

                console.log(curPageId);
                console.log(data);

            },
            error   : function() {}

        });

    });

});
4

1 に答える 1

8

外側のクリックイベントハンドラーが呼び出されたとき

$('a.btn-page-delete').click(function() {

毎回.bind()別のクリックイベントハンドラーになります。$('a#action-confirm')したがって、外部イベントが実行されるたびに、もう1つのイベントハンドラーを追加します。

これをより良い方法で再構築および構築できると確信していますが、現在の状態では、次のような内部クリックハンドラーを選択するしかありませ.unbind()ん.off()。

 $('a#action-confirm').off('click').click(function() {

これにより、以前にjQueryを介してバインドされたクリックイベントハンドラーが削除されます。

参照：.off()

于 2012-08-07T10:20:45.073 に答える