jqueryで選択されたドロップダウンを無効にする

選択したjqueryプラグインを使用してスタイルを設定して機能を追加するselectdivがあります（特に検索）。divは次のようになります。

 <select data-placeholder="add a foobar" id="foobar" style="width: 350px;">
 <option value=""></option>
 </select>

そして、私はこのように選択したプラグインを使用しています、

 $('#foobar').chosen();

一部のAJAXの読み込み中に、<select>div全体を無効にしたいと思います。多分このようなもので、

 $('#foobar').disable()

またはこれ

 $('#foobar').prop('disabled', true)

私はあなたがその考えを理解したと思います。

これを行う方法についてのアイデアはありますか？私は、jqueryイディオムを使用して無効にする、<select>その上にある選択されたものではなく、基になる選択を無効にするだけの無効にするなど、さまざまなことを試しました。z-indexボックスをグレー表示するために、高さのある別のdivを手動で追加することもしましたが、これは醜くてバグがある可能性が高いと思います。

助けてくれてありがとう！

あなたはあなただけを無効にしていますがselect、chooseはそれをdivやspansなどとしてレンダリングします。したがって、selectを無効にした後、プラグインを更新してselectウィジェットも無効にする必要があります。あなたはこの方法を試すことができます：

$('#foobar').prop('disabled', true).trigger("liszt:updated");

//For non-older versions of chosen you would want to do:

$('#foobar').prop('disabled', true).trigger("chosen:updated");

ここで情報を見つけました

フィドル

ウィジェットを更新すると、プラグインのクリックまたはその他のイベントのバインドが解除され、不透明度が0.5に変更されます。divには実際の無効状態がないため。

選択された最新バージョンでは、liszt:updatedはもう機能していません。あなたは使用する必要がありますchosen:updated：

$(".chosen-select").attr('disabled', true).trigger("chosen:updated")

これがJSFiddleです。

PSLは正しかったが、選択はそれ以降更新されている。

無効化した後にこれを置きます：

$("#your-select").trigger("chosen:updated");

$('#foobar').prop('disabled', true).trigger("chosen:updated");

これは完璧に動作します!!!! @chosen v1.3.0

あなたはこれを試すことができます：

$("#foobar").prop('disabled',true).trigger("chosen:updated").chosen('destroy').chosen()

$("chosen_one").chosen({
  max_selected_options: -1
});

$(document).ready(function () {
    $("#foobar").chosen().on('chosen:showing_dropdown',function() {
            $('.chosen-select').attr('disabled', true).trigger('chosen:updated');
            $('.chosen-select').attr('disabled', false).trigger('chosen:updated');
            $('.search-choice-close').hide();
    });
    $('.search-choice-close').hide();
});