我有一个比较简单的形式,询问各种问题.其中一个问题通过选择框回答.我想做的是如果人选择特定选项,则会提示他们获取更多信息.
在几个在线教程的帮助下,我设法得到Javascript来显示一个隐藏的div就好了.我的问题是我似乎无法将事件本地化到Option标签,只有Select标签是没有用的.
<select id="transfer_reason" name="transfer_reason onChange="javascript:showDiv('otherdetail');">
<option value="x">Reason 1</option>
<option value="y">Reason 2</option>
<option value="other">Other Reason</option>
</select>
<div id="otherdetail" style="display: none;">More Detail Here Please</div>
我想要的是如果他们选择“其他原因”,然后显示div.不知道如何使用onChange不能与Option标签一起使用！
任何帮助非常感谢:)
注意：完整的初学者,当谈到Javascript,我道歉,如果这是愚蠢的简单实现！
解决方法
设置选择框的onchange事件处理程序以查看当前选定的索引.如果所选索引为“其他原因”选项,则显示该消息;否则,隐藏分裂.
<html>
<head>
<script type="text/javascript">
window.onload = function() {
var eSelect = document.getElementById('transfer_reason');
var optOtherReason = document.getElementById('otherdetail');
eSelect.onchange = function() {
if(eSelect.selectedIndex === 2) {
optOtherReason.style.display = 'block';
} else {
optOtherReason.style.display = 'none';
}
}
}
</script>
</head>
<body>
<select id="transfer_reason" name="transfer_reason">
<option value="x">Reason 1</option>
<option value="y">Reason 2</option>
<option value="other">Other Reason</option>
</select>
<div id="otherdetail" style="display: none;">More Detail Here Please</div>
</body>
</html>
就我个人而言,我会进一步将JavaScript转移到外部文件中,并将其包含在页面的标题中;然而,对于所有意图和目的,这应该有助于回答你的问题.
