Как мне программно установить значения (множественное число) элемента с несколькими полями для выбора, используя JavaScript?

Question

У меня есть такая форма:

<form action="/cgi-bin/cgi_info.py" method="POST">
  <select id="faults" class="multiselect" multiple="multiple" name="faults[]">
    <option>Big nose
    <option>Big feet
    <option>Wrinkly nose
    <option>Wrinkly feet
    <option>Spotty nose
    <option>Spotty feet
  </select>
</form>

И хотите выбрать, например, все эти опции, содержащие текст «нос», используя событие onclick тега span вокруг некоторого текста.

Можете ли вы помочь мне с JavaScript-кодом onclick?

Спасибо.

Answer 1

Вам нужно перебрать элементы <option>, проверить содержимое и соответственно установить свойство selected:

var faults = document.getElementById("faults").options,
    reg = /\bnose\b/;

for (var i=0, max = faults.length; i < max; i++) {
    faults[i].selected = reg.test(faults[i].innerHTML);
} 

Пример: http://jsfiddle.net/gPQ7U/

Answer 2

Вы можете сделать это так:

</p>

<p><code><form action="/cgi-bin/cgi_info.py" method="POST">
  <select id="faults" class="multiselect" multiple="multiple" name="faults[]">
    <option>Big nose
    <option>Big feet
    <option>Wrinkly nose
    <option>Wrinkly feet
    <option>Spotty nose
    <option>Spotty feet
  </select>
</form></code></p>

<p><code><script></code>
<code>function search(){
    for (i=0; i <= document.getElementById('faults').options.length - 1; i++){
        if (document.getElementById('faults').options[i].text.indexOf('nose') > 0) {
            alert(document.getElementById('faults').options[i].text);</code>
        }
    }
}<code>
 </script></code></p>

<p><code><input type="button" value="Find by text" onclick="search();"></input>