我正在尝试创建一个下拉字段,如果选择“其他”项目,则会出现“请指定”文本框。下面的代码仅适用于一个下拉选择字段,但是一旦我添加第二个选择字段,它就不再起作用。
这是我所拥有的似乎不起作用的内容:
CSS...
#techother{display:none;}
#lmsother{display:none;}
Body...
<p>Chose Your Browser: <select name = "Browser" required>
<option value = "">-- Select an Option --</option>
<option value = "1">IE</option>
<option value = "2">FF</option>
<option value = "3">Safari</option>
<option value = "4">Opera</option>
<option value = "5">Other</option>
</select>
</p>
<div id="browserother">
<p>Please Specify: <label id="browserlabel"><input name="Other Browser" type="text" placeholder="Other Browser" size="50" /></label></p>
</div>
<p>Operating System: <select name = "OS" required>
<option value = "">-- Select an Option --</option>
<option value = "Win">Windows</option>
<option value = "ios">iOS</option>
<option value = "otheros">Other</option>
</select>
</p>
<div id="osother">
<p>Please Specify: <label id="oslabel"><input name="Other OS" type="text" placeholder="Other OS" size="50" /></label></p>
</div>
脚本...
<script>
$('form select[name=Browser]').change(function(){
if ($('form select option:selected').val() == '5'){
$('#browserother').show();
}else{
$('#browserother').hide();
}
});
$('form select[name=OS]').change(function(){
if ($('form select option:selected').val() == 'otheros'){
$('#osother').show();
}else{
$('#osother').hide();
}
});
</script>
有办法让这个工作吗?谢谢!
试试这个演示:http://jsfiddle.net/2pM3n/1/
$('select[name=Browser]').change(function () {
if ($(this).val() == '5') {
$('#browserother').show();
} else {
$('#browserother').hide();
}
});
$('select[name=OS]').change(function () {
if ($(this).val() == 'otheros') {
$('#osother').show();
} else {
$('#osother').hide();
}
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)