您的位置：首页 > Web前端 > JavaScript

JS，如果改变span标签的是否隐藏属性

2011-10-05 16:20 471 查看

测试：
test.html

代码：

<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.0Transitional//EN"> <HTML> <HEAD> <TITLE>NewDocument</TITLE> <SCRIPTLANGUAGE="JavaScript"src="js/Menu.js"></SCRIPT> </HEAD> <BODY> <table> <tr> <td> <formmethod="post"action="#"> 查询类型<selectid="selectType"name="selectType"onchange="isChang1(this.value)"> <optionvalue="yxsh">按院系</option> <optionvalue="zgh">职工号</option> <optionvalue="xm">姓名</option> </select> <spanid="yxsh"style=display:>院系 <selectid="depart"name="depart"> <optionvalue="all">所有院系</option> <optionvalue="123">123</option> <optionvalue="123">123</option> <optionvalue="123">123</option> <optionvalue="123">123</option> <optionvalue="123">123</option> </select> 课程分配 <selectid="isAll"name="isAll"> <optionvalue="all">所有</option> <optionvalue="NO">未分配</option> <optionvalue="YES">已分配</option> </select> </span> <spanid="key"style=display:none> <inputtype="text"name="keyword"id="keyword"/> </span> <inputtype="submit"value="查询"/> </form> </BODY> </HTML>

----------------------------------Hongten--------------------------------------------

js/Menu.js

代码：

//这是用了自定义的方法hideElement()和shwoElement()
functionisChang(values)
{
if(values=="yxsh"){
hideElement("key");
showElement("yxsh");
}else{
hideElement("yxsh");
showElement("key");
}
}

//自定义方法hideElement()
functionhideElement(id){
document.getElementById(id).style.display="none";
}

//自定义方法showElement()
functionshowElement(id){
document.getElementById(id).style.display="";
}

//这是不用自定义函数直接设置是否隐藏
functionisChang1(values)
{
if(values=="yxsh"){
document.getElementById("yxsh").style.display="";
document.getElementById("key").style.display="none";
}else{
document.getElementById("yxsh").style.display="none";
document.getElementById("key").style.display="";
}
}

----------------------------------Hongten--------------------------------------------

测试结果：

其默认选择是：按院系

这是如果我们选择的是：不按院系，即按：职工号或姓名，那么，

这时就会隐藏：

<spanid="yxsh"style=display:none>...</span>

并且<spanid="key"style=display:>...</span>

如果我们是选择：按院系，即默认情况下

那么，结果是：
<spanid="yxsh"style=display:>...</span>

并且<spanid="key"style=display:none>...</span>

----------------------------------Hongten--------------------------------------------

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航