0

次のような選択フォームがあります。

<select multiple="multiple" id="id_color_id" name="color_id"">
<option value="1">Red</option>
<option value="2">Blue</option>
<option value="3">Brown</option>
</select>

私がやりたいのは、JavaScriptを介して上記の項目を選択することです。これは実際には非表示のフォームの一部なので、フォームのシリアライズ部分を利用するだけです。シリアライズ後にハッキングしてこれを追加する方が簡単だと思いますが、すでに選択されているオプションの選択を解除したいと思います。

2つの質問：

  1. JavaScript を介してオプションを選択する方法。私が知っているのは「赤」、「青」、または「茶色」だけです。また、値を取得できるルックアップ辞書もあります。

  2. 上記のいずれかを選択する前に、すべてのオプションを選択解除する方法。

これは関連しています: JQuery を介した選択でのオプションの選択

4

3 に答える 3

2

ネイティブ Javascript:

var textToFind = 'Red';

var dd = document.getElementById('id_color_id');
for (var i = 0; i < dd.options.length; i++) {
    if (dd.options[i].text === textToFind) {
        dd.selectedIndex = i;
        break;
    }
}

またはjQueryを使用：

$('#id_color_id option:contains('Blue')').prop('selected',true);

変数付き:

var blue = "Blue";
$('#id_color_id option:contains(' + blue + ')').prop('selected',true);

選択したすべてのオプションの選択を解除するには:

ネイティブ Javascript:

var elements = document.getElementById("id_color_id").options;

    for(var i = 0; i < elements.length; i++){
       if(elements[i].selected)
        elements[i].selected = false;
    }

jQuery:

$("#id_color_id option:selected").removeAttr("selected");
于 2013-04-20T20:52:24.720 に答える
0

その内容によってオプションを選択するには (投稿したものがあなたが持っているものであることを考慮して)

$("#id_color_id option:contains('Red')").prop('selected',true);

jsFiddle デモ

于 2013-04-20T20:53:50.117 に答える
0

.val()メソッドを使用して、選択ボックスに値を設定できます。これを実行すると、以前に選択した値がリセットされるため、その部分を達成するために特別なことをする必要はありません。複数選択を使用しているため、配列を使用して複数の値を選択することもできます。

$("#id_color_id").val(['1','2']);
于 2013-04-20T20:54:24.723 に答える