JS 如果改變span標(biāo)簽的是否隱藏屬性

2019-11-20 23:38:45

字體：大中小

供稿：網(wǎng)友

測(cè)試：
test.html
代碼：

 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> New Document </TITLE> 
<SCRIPT LANGUAGE="JavaScript" src="js/Menu.js"></SCRIPT> 
</HEAD> 
<BODY> 
<table> 
<tr> 
<td> 
<form method="post" action="#"> 
查詢類型<select id="selectType" name="selectType" onchange="isChang1(this.value)"> 
<option value="yxsh">按院系</option> 
<option value="zgh">職工號(hào)</option> 
<option value="xm">姓名</option> 
</select> 
<span id="yxsh" style=display:>院系 
<select id="depart" name="depart"> 
<option value="all">所有院系</option> 
<option value="123">123</option> 
<option value="123">123</option> 
<option value="123">123</option> 
<option value="123">123</option> 
<option value="123">123</option> 
</select> 
課程分配 
<select id="isAll" name="isAll"> 
<option value="all">所有</option> 
<option value="NO">未分配</option> 
<option value="YES">已分配</option> 
</select> 
</span> 
<span id="key" style=display:none> 
<input type="text" name="keyword" id="keyword"/> 
</span> 
<input type="submit" value="查詢"/> 
</form> 
</BODY> 
</HTML> 

js/Menu.js
代碼：

復(fù)制代碼代碼如下:

 
//這是用了自定義的方法hideElement()和shwoElement() 
function isChang(values) 
{ 
if(values=="yxsh"){ 
hideElement("key"); 
showElement("yxsh"); 
}else{ 
hideElement("yxsh"); 
showElement("key"); 
} 
} 
//自定義方法hideElement() 
function hideElement(id){ 
document.getElementById(id).style.display="none"; 
} 
//自定義方法showElement() 
function showElement(id){ 
document.getElementById(id).style.display=""; 
} 
//這是不用自定義函數(shù)直接設(shè)置是否隱藏 
function isChang1(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=""; 
} 
} 