為什么運(yùn)行不了?
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>登錄界面</title>
<style type="text/css">
*{
margin: 0;
padding:0;
font-size: 16px;
}
#login_box{
width: 300px;
height: 150px;
border:1px solid #C7B0B0;
background: #F0E6E6;
margin: 180px auto;
display: none;
}
#login_box p{
font-size: 14px;
font-weight: bold;
height: 30px;
line-height: 30px;
border-bottom:1px solid #C7B0B0;?
}
</style>
<script type="text/javascript">
window.onload=function(){
? ? ? ?var login_btn=document.getElementById('login'),
? ? ? ? ? ?login_box=document.getElementById('login_box'),
? ? ??
? ? ? ?// 封裝添加事件監(jiān)聽(tīng)程序
? ? ? ? function addEvent(ele,type,hander){
? ? ? ? ? if(ele.addEventListener){
? ? ? ? ? ? ele.addEventListener(type,hander,false);
? ? ? ? ? }else if(ele.attachEvent){
? ? ? ? ? ? ele.attachEvent('on'+type,hander);
? ? ? ? ? }else{
? ? ? ? ? ?ele['on'+type]=hander;
? ? ? ? ? }
? ? ? ?}
? ? ? ? // 顯示登錄層函數(shù)
? ? ? ?function showlogin(){
? ? ? ?login_box.style.display='block';
? ? ? ?}
? ? ? ? // 隱藏登錄層函數(shù)
? ? ? ? function hidelogin(){
? ? ? ? ? login_box.style.display='none';
? ? ? ? }
addEvent(login,'click',showlogin);
}
</script>
</head>
<body>
<div id="head">
親,您好!
<input type="button" value="登錄" id="login"/>
</div>
<div id="login_box">
<p>用戶登錄</p>
</div>
</body>
</html>
為什么我寫的代碼會(huì)運(yùn)行不了?而且把老師的代碼里面關(guān)于id=close的標(biāo)簽和屬性刪除之后運(yùn)行不了,添加了反而可以運(yùn)行?
2016-12-28
addEvent(login,'click',showlogin);這里寫錯(cuò)了,取到的元素命名為login_box,把第一個(gè)參數(shù)改為login_box就可以了。