-1

ページに追加されたときに、閉じるボタンを div に動的に挿入する関数があります。

//Insert Close ALERT WINDOW button
function addCloseAlertButton(){
    if ($(".alert").find('.closeAlerts').length < 1){
        $(".alert").append('<div class="closeAlerts" onclick="closeAlert()">Dismiss</div>');
    }

};

そして onclick によって呼び出される関数:

//Close Alert Function
function closeAlert(){
        $(this).parent().remove();
};

しかし、div をクリックしても、期待どおりにアラート div が削除されません。私console.log($(this))が関数に入ったとき、それ$(this)が全体を参照していwindowて$(this).parent空になったので、関数が機能していないことがわかりました。

なぜこれが起こっているのか、どうすればそれを作成できるのか$(this)、全体ではなく呼び出し側の div を参照する方法を知っている人はいますwindowか?

4

4 に答える 4

4

そのためにインライン JS を使用しないでください。代わりに、イベント委任を使用します。

$(document).on('click', '.closeAlerts', function(){
    $(this).parent().remove();
});
于 2013-11-13T19:39:03.813 に答える
2

あなたの

onclick="closeAlert()"

これとともに：

onclick="closeAlert.call(this)"

そしてそれはうまくいくはずです。

于 2013-11-13T19:39:12.010 に答える
1

インライン イベント ハンドラを使用しているためです。ハンドラー関数を分離したい場合は、これが 1 つの可能性になります。

function addCloseAlertButton() {
    if ($(".alert").find('.closeAlerts').length < 1) {
        $('<div class="closeAlerts">Dismiss</div>')
            .appendTo('.alert')
            .click(closeAlert);
    }

};

function closeAlert() {
    $(this).parent().remove();
};
于 2013-11-13T19:39:04.583 に答える