<p>選択：openは機能しません</p>

作成日 2013年12月22日 · 5コメント · ソース: harvesthq/chosen

ボタンをクリックした後に選択を開こうとしていますが、機能しません。トリガーの後に挿入してalert（）を実行すると、トリガーが開きます...
（選択したv1.0をjqueryで使用）

例：

<select id="select">
    <option value="1">a</option>
    <option value="2">b</option>
    <option value="3">c</option>
</select>
<br>
<button onclick="$('#select').trigger('chosen:open'); ">Press this button to open (doesnt work) </button>
<button onclick="$('#select').trigger('chosen:open'); alert('ups!');">Press this button to open (work???)</button>

<script>
$(document).ready(function() {
$('#select').chosen();
});
</script>

例： http ：

ソース

vpode

最も参考になるコメント

ボタンをクリックすると、Chosenはchosen:openイベントを受信します。ただし、イベントはDOMをバブルし続け、ChosenはアクティブなChosenではない要素のクリックをすぐに検出します...そのため、要素を閉じます。わかる？

インラインJSを使用している場合、最も簡単な解決策は、 setTimeoutを使用して現在のイベントスタックから抜け出すことです。

onClick="setTimeout(function(){ $('#select').trigger('chosen:open'); }, 0)"

ただし、ほぼ確実にインラインJSを使用するべきではありません。必要に応じてsetTimeout使用することもできますが、イベントのバブリングを停止するだけで十分です。

$('button').on("click", function(evt){
  evt.stopPropagation();
  $('#select').trigger('chosen:open');
});

私はあなたのフィドルをこの動作するコードで更新しました： http ：

pfiller 2013年12月28日

👍4

全てのコメント5件

Fiddle（Safari）ではどちらのボタンも機能しません。

どのブラウザ/バージョンを使用していますか？

tjschuck 2013年12月23日

私はそれをテストしました：

Firefox 25.0.1
Opera 12.16
クローム31.0.1650.63m

最初のボタンが機能しない
2番目のボタンはオプションリストを開きます（「アラート」ボックスを閉じたときにのみ閉じます）。

vpode 2013年12月23日

インラインJSを使用している場合、最も簡単な解決策は、 setTimeoutを使用して現在のイベントスタックから抜け出すことです。

onClick="setTimeout(function(){ $('#select').trigger('chosen:open'); }, 0)"

$('button').on("click", function(evt){
  evt.stopPropagation();
  $('#select').trigger('chosen:open');
});

私はあなたのフィドルをこの動作するコードで更新しました： http ：

pfiller 2013年12月28日

👍4

ありがとう@pfiller

pruett 2014年04月22日

@pfillerに感謝し

shivaray 2016年07月26日

このページは役に立ちましたか？

0 / 5 - 0 評価

<p>選択：openは機能しません</p>

最も参考になるコメント

全てのコメント5件

関連する問題