在JSP页面中,我有一个下拉列表.当选择列表的第一个元素时,我希望在单击时显示文本区域.我是
Javascript / Jquery的新手,所以我显然在函数中缺少一些东西(文本区域永远不会出现).希望有人能提供帮助.
这是HTML：
<tr class="odd gradeX">
<td class="col-lg-3">
<div>
<label>Show text area</label>
<select id="show" class="form-control" name="show_text_area" onchange="change()">
<option value="1">YES</option>
<option value="0">NO</option>
</select>
</div>
</td>
<td class="col-lg-3">
<div>
<label>Text area</label>
<textarea id="text_area" class="form-control" type="text" name="text_area" placeholder="Write something" rows="5" cols="50" style="display: none"></textarea>
</div>
</td>
</tr>
这是JSP上的函数：
<script> function change() {
var selectBox = document.getElementById("show");
var selected = selectBox.options[selectBox.selectedIndex].value;
var textarea = document.getElementById("text_area");
if(selected === '1'){
textarea.show();
}
else{
textarea.hide();
}
});</script>
解决方法
你的功能结束时有错误 – 删除最后一个);
最后它应该是：
<select id="show" class="form-control" name="show_text_area" onchange="change(this)">
function change(obj) {
var selectBox = obj;
var selected = selectBox.options[selectBox.selectedIndex].value;
var textarea = document.getElementById("text_area");
if(selected === '1'){
textarea.style.display = "block";
}
else{
textarea.style.display = "none";
}
}
