[解決済み] 選択後にアクションを起こす select2
2023-06-22 09:52:29
質問
私は
select2ライブラリ
を使っています。
検索結果を選択した後にアクションをトリガーする方法はありますか? 例えば、ポップアップを開く、または単純なjsアラートなど。
$("#e6").select2({
placeholder: "Enter an item id please",
minimumInputLength: 1,
ajax: { // instead of writing the function to execute the request we use Select2's convenient helper
url: "index.php?r=sia/searchresults",
dataType: 'jsonp',
quietMillis: 3000,
data: function (term, page) {
return {
q: term, // search term
page_limit: 10,
id: 10
};
},
results: function (data, page) { // parse the results into the format expected by Select2.
// since we are using custom formatting functions we do not need to alter remote JSON data
return {results: data};
},
},
formatResult: movieFormatResult, // omitted for brevity, see the source of this page
formatSelection: movieFormatSelection, // omitted for brevity, see the source of this page
dropdownCssClass: "bigdrop", // apply css that makes the dropdown taller
escapeMarkup: function (m) { return m; } // we do not want to escape markup since we are displaying html in results
});
どのように解決するのですか?
バージョンによりますが、以下のスニペットのうちの1つが欲しいイベントを与えてくれるはずです。代わりに、"select2-selecting" を "change" に置き換えるだけです。
バージョン 4.0 +。
イベントの形式を変更しました。
select2:selecting
(代わりに
select2-selecting
)
4.0から変更されたことを知らせてくれたsnakeyに感謝します。
$('#yourselect').on("select2:selecting", function(e) {
// what you would like to happen
});
4.0より前のバージョン
$('#yourselect').on("select2-selecting", function(e) {
// what you would like to happen
});
念のためですが
select2-selecting
を読み取ります。
選択2-選択中 ドロップダウンで選択されているときに実行されます。 ドロップダウンで選択されているとき、しかし、選択内容に変更が加えられる前に発生します。 このイベントは、ユーザが選択を拒否できるようにするために イベント.preventDefault()
があるのに対し、changeは
<ブロッククオート変更 選択範囲が変更されたときに発行されます。
そのため
change
は、選択を完了させてからイベントを実行したいのか、あるいは変更をブロックする可能性があるのかによって、ニーズにより適切な場合があります。
関連
-
[解決済み] jQuery Ajax呼び出し後のリダイレクトリクエストを管理する方法
-
[解決済み] スクロールした後に要素が表示されているかどうかを確認するには?
-
[解決済み] jQuery 複数のイベントで同じ関数を起動する
-
[解決済み] jQueryでtextareaの値を設定する
-
[解決済み] jQueryがどのバージョンで読み込まれているかを確認するには?
-
[解決済み] jQueryの複数要素の同一クリックイベント
-
[解決済み] jQueryを使ってロールオーバー時に画像ソースを変更する
-
[解決済み] jQueryを使用してspanに値を設定する方法
-
[解決済み】ブートストラップ・モーダルに埋め込むとSelect2が機能しない
-
[解決済み】select2 - 検索ボックスを非表示にする
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] jQuery.ajaxでmultipart/formdataを送信する。
-
[解決済み] jQuery UI DatePicker - 日付フォーマットの変更
-
[解決済み] Twitter Bootstrapのモーダルウィンドウを閉じないようにする
-
[解決済み] jQuery: テーブルの行数を数える
-
[解決済み] jQueryを使ってロールオーバー時に画像ソースを変更する
-
[解決済み] jQueryでフォームフィールドをクリアする
-
[解決済み】jQuery:keyPress Backspaceが発射されない?
-
[解決済み】iPad版SafariでjQueryを使ってタッチイベントを認識させる方法は?可能でしょうか?
-
[解決済み] jQueryで選択されたオプションのインデックスを取得する
-
[解決済み] Jqueryのコードはヘッダーとフッターのどちらに入れるべきですか?