ホームページ  >  記事  >  バックエンド開発  >  jQuery Select2 ドロップダウンで選択した値を設定するにはどうすればよいですか?

jQuery Select2 ドロップダウンで選択した値を設定するにはどうすればよいですか?

Patricia Arquette
Patricia Arquetteオリジナル
2024-10-27 09:20:03261ブラウズ

How do I Set the Selected Value in a jQuery Select2 Dropdown?

jQuery Select2 の選択値を設定する方法?

Select2 は、検索可能、タグ付け可能な、複数値の選択ボックスを作成するための強力な jQuery プラグインです。このガイドでは、使用されているバージョン (v4 以前または v4 以降) に応じて、Select2 インスタンス内で特定の値を選択されたように設定する 3 つの方法について概説します。

Select2 < v4

  1. 空の入力フィールドを作成します: を追加します。 type 属性が「hidden」に設定され、Select2 インスタンスに対応する id 属性を持つ要素。
  2. Select2 の初期化: select2() メソッドを使用して Select2 インスタンスを作成し、インスタンスに必要なオプション。
  3. 選択した値を設定します。 select2('data', { id: "", text: "" }) メソッドを使用して、選択した値を設定します。選択する項目の ID と関連するテキストを指定します。
  4. Select2 v4 以上

    HTML の場合は次を選択します:

    1. 選択したオプションを追加します: を追加します。 selected 属性を「selected」に設定した要素を選択し、目的の値とテキストを指定します。
    2. 変更イベントをトリガーする: トリガー('change') を使用して、Select2 インスタンスを新しいイベントで更新します。 value.

    非 HTML 選択 (JQuery):

    1. 新しいオプションを作成します: jQuery $ を使用します新しい
    2. 変更を追加してトリガーします: append() を使用して新しいオプションを Select2 インスタンスに追加し、trigger('change') を使用して変更イベントをトリガーします。

    単純な値を設定する場合:

    新しいオプションを作成せずに単純な値を設定するには、val(value).trigger('change') を使用します。

    例:

    <code class="javascript">$('#mySelect2').select2('data', { id: '5', text: 'Option 5' });</code>

    このコードは、ID が「5」のオプションと、ID の Select2 のインスタンス内で選択されたテキスト「Option 5」を設定します。 "mySelect2."

    以上がjQuery Select2 ドロップダウンで選択した値を設定するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。