如果用户从下拉列表中选择一个选项,它会将其显示为文本框,但如果他选择的值为“其他”的选项,则会出现一行为其他人键入值。
我的代码工作正常,除非选项值不等于“其他”
<script type="text/javascript"><!--
function setAndReset(box) {
if(box.value == 'Other'){
$("#ShowHide").hide();
}
document.FormName.hiddenInput.value = box.value;
}
//-->
</script>
<body bgcolor="#ffffff">
<form id="FormName" action="" method="get" name="FormName">
<select name="choice1" size="1" onchange="setAndReset(this);">
<option value="one">first</option>
<option value="two">second</option>
<option value="three">third</option>
<option value="other">Other</option>
</select>
<input type="text" name="hiddenInput" value="">
<tablt><tr id="ShowHide"><td>
<input type="text" name="otherInput">
</td></tr></table>
<input type="submit" name="submitButtonName">
</form>
</body>
但它没有显示/隐藏&amp;没有在文本框中设置值。
如果使用jquery解决,那么我会感谢您的代码。
感谢。
答案 0 :(得分:5)
这样做:
$(document).ready(function() {
$("select[name=choice1]").change(function() {
$(this).val() == 'other' ? $("#ShowHide").show() : $("#ShowHide").hide();
});
});
并丢失内联onchange函数调用。 Try it here
答案 1 :(得分:1)
我喜欢karim79的答案,但更喜欢它更紧凑:
$(function() {
$("select[name=choice1]").change(function() {
$("#ShowHide").toggle($(this).val() === "other");
});
});
$(document).ready(f)
,而是$(f)
,它完全相同==
代替松散===
进行精确比较(在这种情况下无关紧要,但==
行为奇怪,所以你应该避免它到处都是)< / LI>
toggle(b)
代替show()
/ hide()