javascript - 如果我在下拉框中选择其他选项,如何激活文本框

标签 javascript html

假设我在下拉框中有 3 个选项,比如红色、蓝色和其他。 如果用户选择其他选项,则应在文本框下方显示他自己喜欢的颜色。 我可以用颜色填充下拉框,但不知道如何在选择其他内容时使文本框可见 下拉框。我知道使用 javascript 可以做到,但我对 javascript 还很陌生。谁能帮帮我 出??

这是我在 html 表单中实现的选择选项

   <select name="color"> // color
    <option>pick a color</option>  
    <option value="red">RED</option>
    <option value="blue">BLUE</option>
    <option value="others">others</option>
</select>

<input type="text" name="color" id="color" /></td> // this textbox should be hidden //until unless others is selected in the drop down box

最佳答案

以下是您需要编写的核心 JavaScript:

<html> 
<head>  
<script type="text/javascript">
function CheckColors(val){
 var element=document.getElementById('color');
 if(val=='pick a color'||val=='others')
   element.style.display='block';
 else  
   element.style.display='none';
}

</script> 
</head>
<body>
  <select name="color" onchange='CheckColors(this.value);'> 
    <option>pick a color</option>  
    <option value="red">RED</option>
    <option value="blue">BLUE</option>
    <option value="others">others</option>
  </select>
<input type="text" name="color" id="color" style='display:none;'/>
</body>
</html>

关于javascript - 如果我在下拉框中选择其他选项,如何激活文本框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9634783/

相关文章:

javascript - 如何在 onchange() 事件后调用的方法中将焦点设置到输入字段?

javascript - Sinon,使用 Promise.reject() 到 stub.rejects() 观察不同的行为

html - 如何居中 svg 背景图像?

javascript - 居中 div margin top 和 margin bottom

javascript - 通过复选框选择形成人口

javascript - 如何使用 Javascript HTML5 裁剪自定义形状

html - 文字不会居中?

html - 如何在 span 标签中做 CSS nth-child?

javascript - 按回车键时如何将标签保持在文本区域中?

javascript - 通过 POST 将文件传递给 NodeJS,然后传递给另一个 API,而不保存在磁盘上