JavaScript 获取Select标签选中的项

时间:2023-03-09 19:19:59
JavaScript 获取Select标签选中的项
<select name="select1" id="select1" onchange=setInput()>
<option value="1">FIRST BLOOD</option>
<option value="2">SECOND BLOOD</option>
<option value="3">THIRD BLOOD</option>
<option value="4">FOURTH BLOOD</option>
<option value="5">FIFTH BLOOD</option>
<option value="6">SIXTH BLOOD</option>
<option value="7">SEVENTH BLOOD</option>
</select>
<input id="input" type="text" />

有一个select标签,里面有一些项,把select选中项的文本传递给input,javascript代码如下

<script type="text/javascript">

    function setInput(){
var selectcontrol=document.getElementById ("select1");
var text=document.getElementById("input");
for(var i=0;i<selectcontrol.options.length;i++)
{
if(selectcontrol.options[i].selected)
{
text.value=selectcontrol.options[i].text;
}
}
}
</script>

或者可以将选中的值传递过去

text.value=selectcontrol.options[i].value;

另一种方法可以直接将select选中的值传递给text:

<select name="selector" onchange=setInput(this.value)>
<option value="1">FIRSTBLOOD</option>
</select>
<input type="text" id="text"/> <script type="text/javascript">
function setInput(value){
var text=document.getElementById("text");
text.value=value;
}
</script>