jQuery - ドロップダウンの確認ダイアログで変更イベントをキャンセルする 質問する

jQuery - ドロップダウンの確認ダイアログで変更イベントをキャンセルする 質問する

ドロップダウンと jQuerychange関数があります。

確認ダイアログに従って選択した項目の変更を実装したいと思います。

確認が真であれば、選択した変更を続行できます。そうでない場合は、既存の項目を選択したままにして、変更イベントをキャンセルします。

これを jQuery で実装するにはどうすればいいでしょうか?

jQuery 関数

$(function () {
    $("#dropdown").change(function () {
        var success = confirm('Are you sure want to change the Dropdown ????');
        if (success == true) {
            alert('Changed');  
            // do something                  
        }
        else {
            alert('Not changed');
            // Cancel the change event and keep the selected element
        }
    });
});

覚えておくべきことの 1 つは、change関数は選択された項目が変更された後にのみ実行されることです。したがって、これを実装することを検討する方がよいでしょうonchangeが、jQuery では利用できません。これを実装する方法はありますか?

ベストアンサー1

Vinu が正しく指摘しているように、jQuery のchangeイベントは、select の値が実際に変更された場合にのみトリガーされます。次のようにした方がよいでしょう。

var prev_val;

$('#dropdown').focus(function() {
    prev_val = $(this).val();
}).change(function() {
     $(this).blur() // Firefox fix as suggested by AgDude
    var success = confirm('Are you sure you want to change the Dropdown?');
    if(success)
    {
        alert('changed');
        // Other changed code would be here...
    }  
    else
    {
        $(this).val(prev_val);
        alert('unchanged');
        return false; 
    }
});

おすすめ記事