HTML/JavaScript表单木里列表选择警报不工作

我有以下形式和javascript：HTML/JavaScript表单木里列表选择警报不工作

function test() { 
 
    var options = document.getElementById('genres1').options, 
 
    count = 0; 
 
    for (var i = 0; i < options.length; i++) { 
 
    if (options[i].selected) count++; 
 
    } 
 

 
    alert(options); 
 
}

<form> 
 
    <select name="genres" id="genres1" size="6"> 
 
\t <option value="r&b">R&B</option> 
 
\t <option value="jazz">Jazz</option> 
 
\t <option value="blues">Blues</option> 
 
\t <option value="newAge">New Age</option> 
 
\t <option value="classical">Classical</option> 
 
\t <option value="opera">Opera</option> 
 
\t </select><br><br> 
 
    <input type="button" value="How many are selected?" onclick="test();" /> 
 
</form>

我想产生一个警告信息，这将给项目的数量由用户从列表中选择。我一直在打击死胡同，包括无法选择多个选项。非常感谢。

来源

2017-02-21 ron evans

用户选择的项目数量未显示的原因是因为您没有显示计数。

你在做alert(options);，我认为这是一个错误，你打算写alert(count);。

其次，你可以选择多个选项下面的解决方案应该做的：

<form> 
    <select name="genres" id="genres1" size="6" multiple> <!-- note the use of "multiple" --> 
     <option value="r&b">R&B</option> 
     <option value="jazz">Jazz</option> 
     <option value="blues">Blues</option> 
     <option value="newAge">New Age</option> 
     <option value="classical">Classical</option> 
     <option value="opera">Opera</option> 
    </select><br><br> 
    <input type="button" value="How many are selected?" onclick="test();"/> 
</form>

而且，记住选择多个选项在不同的操作系统和浏览器的不同而不同：

对于Windows：按住控制（CTRL）键选择多个选项
对于Mac：按住d拥有命令按钮来选择多个选项

来源

2017-02-21 20:05:52

感谢清理它现在可以正常使用！非常感谢。 –

没问题！很高兴知道：）。 –

请检查该代码

<script type="text/javascript"> 
function test() 
{ 
    count = 0; 
    var x=document.getElementById("genres1"); 
    for (var i = 0; i < x.options.length; i++) { 
    if(x.options[i].selected ==true){ 
      alert(x.options[i].value); 
      count++; 
     } 
    } 
    alert(count) 
} 
</script>

和HTML代码

<form> 
<select name="genres" id="genres1" size="6" multiple=""> 
<option value="r&b">R&B</option> 
<option value="jazz">Jazz</option> 
<option value="blues">Blues</option> 
<option value="newAge">New Age</option> 
<option value="classical">Classical</option> 
<option value="opera">Opera</option> 
</select><br><br> 
<input type="button" value="How many are selected?" onclick="test();"/> 
</form>

来源

2017-02-21 20:06:02

请检查此代码........... –

HTML/JavaScript表单木里列表选择警报不工作

回答

相关问题