在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"; } }