下拉列表 SelectedIndex 不适用于 javascript 中的 getElementById

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/11856000/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 14:34:05  来源:igfitidea点击:

DropDown List SelectedIndex is not working with getElementById in javascript

javascripthtml-select

提问by namalfernandolk

I have a DropDown list named as batches. If I selected 2nd option,dropdown.selectedIndex inside the OnChange function always shows the selected index. But document.getElementById("batches").selectedIndex always shows the 1st index.
Why is this?
Actually I want read the correct selectedIndex of batches in another function that's why I need a way to get the correct selected index in both ways.

我有一个名为批次的下拉列表。如果我选择了第二个选项,OnChange 函数内的 dropdown.selectedIndex 始终显示所选索引。但是 document.getElementById("batches").selectedIndex 总是显示第一个索引。
为什么是这样?
实际上,我想在另一个函数中读取正确的 selectedIndex 批次,这就是为什么我需要一种方法以两种方式获得正确的选定索引。

function OnChange(dropdown){
   var myindex  = dropdown.selectedIndex;// This prints correctly
   alert("Index : "+document.getElementById("batches").selectedIndex);// This is always 0 no metter what selects        
}

<select name='batches' id='batches' onchange='OnChange(this);'>
<option value = "1">1</option>
<option value = "2">2</option>
<option value = "3">3</option>
</select>

回答by

Because you call the function onChange event i.e not in the past. Try to trigger the function without onchange event and the property is selected in the past

因为你调用函数 onChange 事件即不是过去。尝试在没有onchange事件的情况下触发该功能并且该属性是过去选择的

        <select name='batches' id='batches' onchange='someFunc();'>
<option value = "1">1</option>
<option value = "2">2</option>
<option value = "3">3</option>
</select>
<a href="javascript:someFunc()">Test</a>

<script>
function someFunc(){
   //var myindex  = dropdown.selectedIndex;// This prints correctly
   alert("Index : "+document.getElementById("batches").selectedIndex);// This is always 0 no metter what selects        
}
</script>

it will work. Just copy and paste this code into your text editor and test it

它会起作用。只需将此代码复制并粘贴到您的文本编辑器中并进行测试

回答by RobG

I don't know what browser you are testing in, but the following always shows true in all browsers I tested in:

我不知道您正在测试什么浏览器,但以下在我测试的所有浏览器中始终显示为真:

<select id="batches" onchange="
  alert(this.selectedIndex == document.getElementById('batches').selectedIndex);
">
  <option value = "1">1
  <option value = "2">2
  <option value = "3">3
</select>

<!-- and to confirm... -->
<button onclick="
  alert(document.getElementById('batches').selectedIndex);
">Show selected index</button>

I hope you aren't being confused by having options values 1, 2 and 3 correlate to selectedIndexes 0, 1 and 2.

我希望您不会因为选项值 1、2 和 3 与 selectedIndexes 0、1 和 2 相关而感到困惑。