根据javascript中的选择选项显示/隐藏div [英] Show/hide div according to select option in javascript
本文介绍了根据javascript中的选择选项显示/隐藏div的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
搜索了互联网.了解了如何执行此操作.实现了.但这是行不通的.我想在选择学生时显示div学生,在选择老师时显示div老师.这是jsp文件的一部分.
Searched the internet. Learnt how to do this. Implemented it. But it doesn't work. I want to show the div student when student is selected and the div teacher when teacher is selected. This is a part of a jsp file.
HTML代码:
<table>
<tr>
<td>
<select id="userType">
<option value="student">STUDENT</option>
<option value="teacher">TEACHER</option>
<option value="admin">ADMIN</option>
</select>
</td>
</tr>
<table>
JavaScript代码:
<script type="text/javascript">
var elem = document.getElementById('userType');
elem.onchange = function() {
var studentDiv = document.getElementById('student');
var teacherDiv = document.getElementById('teacher');
studentDiv.style.display = (this.value.equals("student")) ? 'block':'none';
teacherDiv.style.display = (this.value.equals("teacher")) ? 'block':'none';
};
</script>
自早上以来,我一直在努力做到这一点.也尝试了其他方法.什么都行不通.我在做什么错了?
I've been trying to get this right since morning. Tried other methods as well. Nothing works. What am I doing wrong?
推荐答案
Change equals
to ==
in your code and it works DEMO
var elem = document.getElementById('userType');
elem.onchange = function() {
var studentDiv = document.getElementById('student');
var teacherDiv = document.getElementById('teacher');
studentDiv.style.display = (this.value == "student") ? 'block' : 'none';
teacherDiv.style.display = (this.value == "teacher") ? 'block' : 'none';
};
这篇关于根据javascript中的选择选项显示/隐藏div的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文