ユーザーが [選択] をクリックして表示する必要がないように、JavaScript を使用して [ Chosen] ドロップダウンを開く必要があります。これを行うにはどうすればよいですか?
6 に答える
次のようにして、選択した選択ボックスを JS 経由で開くことができます。
$('#<id-of-your-select>_chzn').trigger('mousedown');
<id-of-your-select>
要素のIDはどこにありますか<select>
。
例:<select>
要素が のような場合<select id="foo" ...>
、上記のコードは次のようになります。
$('#foo_chzn').trigger('mousedown');
それは非常に奇妙ですが、答えはタイムアウトを使用していることがわかりました
おそらく私の要素がクローンされているため、最初にタイムアウトする必要があります他の人に役立つことを願っています
setTimeout(function(){ firstElement.trigger("chosen:open"); }, 100);
以下の 2 行をコードに追加すると、選択したものが常に開いたままになります。それは私のために働いた。
list_start
あなたの選択要素IDです。
("#list_start").trigger('chosen:open');
$('.chosen-drop').css('left', 0);
@tzviの回答は、選択が行われた後も開いたままになるように選択をトリガーしようとしている場合に役立ちます(IE:一度に複数の選択を行う)。これを少し拡張させてください(ちなみに、選択した1.0用に更新しました):
$('#selectbox').change(function() {
$('#selectbox_chosen .chosen-drop').css('left', '0');
});
$('html').click(function() {
$('#selectbox_chosen .chosen-drop').css('left', '');
});
$('#selectbox_chosen .chosen-drop').click(function(e) {
e.stopPropagation();
});
基本的に、通常は「アクティブ」クラスによって配置されている css をオーバーライドすることにより、選択したドロップダウンを開いたままにします。次に、ドロップダウン以外の場所をクリックすると、これを元に戻すクリック イベントがいくつかあります。私にとって完璧に機能しました。
編集: ところで、本当に JS 経由でドロップダウンをトリガーしたい場合は、Chosen 1.0 の API を使用します。
$('#selectbox').trigger('chosen:open')
元の質問のコンテキストでは、これにより、選択が行われた後にボックスを開くか、ボックスを再度開くことができます。ただし、選択が行われた後 (しばらく閉じずに) ボックスを開いたままにすることはできません。
これで問題が解決し、
chzn-select が選択した ID であることを確認してください。
chzn-drop は、ユーザーがオプションをクリックした後も開いたままになります。
$('#chzn-select').change(function(event)
{
$('.chzn-drop').css('left', 0);
});