web-dev-qa-db-ja.com

動的なselect2が変更イベントを発生させない

内部にいくつかの選択があるフォームがあります。 select2 jqueryプラグインを次のようなselectに適用しています。

$("select.company_select, select.positions_select").select2();

Selectは正常に動作しますが、フォームを自動送信するためのこのコードがあります（フォームタグに自動送信クラスがあります）。

var currentData;
    $('.autosubmit input, .autosubmit select, .autosubmit textarea').live('focus', function () {
        currentData = $(this).val();
    });

    $('.autosubmit input, .autosubmit select, .autosubmit textarea').live('change', function () {
        console.log('autosubmiting...');
        var $this = $(this);
        if (!currentData || currentData != $this.val()) {
            $($this.get(0).form).ajaxSubmit(function (response, status, xhr, $form) {
                currentData = "";
            });
        }
    });

問題は、select2ではchangeイベントまたはfocusイベントがまったく発生しないことです。 select2を削除すると、イベントは完全に発生します。

私は何を間違えていますか？

jqueryeventsonchangejquery-select2
23
Phoenix_uy

Select2には、openとchangeの2つのイベントしかありません（ http://select2.github.io/select2/#events ）、リスナーのみを追加できます彼らへ。 _<select>_要素には、openの代わりにfocusイベントを使用できます。推奨されないため、live()メソッドを使用しないでください。代わりにon()を使用してください。

_var currentData;
$(".autosubmit select").on("open", function() {
    currentData = $(this).val();
});
$(".autosubmit input").on("focus", function() {
    currentData = $(this).val();
});
$(".autosubmit input, .autosubmit select").on("change", function() {
    var $this = $(this);
    console.log('autosubmitting');
    if (!currentData || currentData != $this.val()) {
        $($this.get(0).form).ajaxSubmit(function (response, status, xhr, $form) {
            currentData = "";
        });
    }
});
_

これが Fiddle です

30
Mikhail Chernykh