2010-06-11 63 views
0

當我點擊按鈕,一個div顯示..每當我點擊正文,該div將被隱藏。關於Div Display

我們如何實現這個功能..我寫一個代碼如下。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
<title>Untitled Document</title> 
<script language="javascript"> 
function HideSubMenus(e) 
{ 
var targ; 
if (!e) var e = window.event; 
if (e.target) targ = e.target; 
else if (e.srcElement) targ = e.srcElement; 
if (targ.nodeType == 3) // defeat Safari bug 
    targ = targ.parentNode; 
for (var i=0; i!=5; i++) { 
    if (!targ) { 
    break; 
    } else if (targ.className=="divclass") { 
    return; 
    } 
    targ = targ.parentNode; 
} 

if(document.getElementById("showdivid")) 
{ 
    document.getElementById("showdivid").style.display=''; 
} 
} 
</script> 
</head> 

<body onclick="HideSubMenus(event);"> 
<input type="button" name="button" value="Click ME" onclick="document.getElementById('showdivid').style.display='';" /> 
<div id="showdivid" class="divclass" style="display:none;"> 
TeSt DIV 
</div> 
</body> 
</html> 

問候 拉吉

+1

接受一些答案,也許人們願意幫助你。 – 2010-06-11 06:06:42

回答

1

希望這有助於。

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
<title>Untitled Document</title> 
<script language="javascript"> 
function HideSubMenus(e) 
{ 
var targ; 
if (!e) var e = window.event; 
if (e.target) targ = e.target; 
else if (e.srcElement) targ = e.srcElement; 
if (targ.nodeType == 3) // defeat Safari bug 
    targ = targ.parentNode; 
    if(targ.className==='btn'){ 
    document.getElementById('showdivid').style.display=''; 
    return; 
    }else{ 
    document.getElementById('showdivid').style.display='none'; 
    } 
} 

</script> 
</head> 

<body onclick="HideSubMenus(event);"> 
<input type="button" name="button" class='btn' value="Click ME" /> 
<div id="showdivid" class="divclass" style="display:none;"> 
TeSt DIV 
</div> 
</body> 
</html> 
+0

嘿 它工作得很好,非常感謝你 – user71723 2010-06-11 06:28:00