                        課程
                    
                        /前端開(kāi)發(fā)
                        
                            /JavaScript
                        
                        /DOM事件探秘

大神，幫我看看這段代碼哪里錯(cuò)了

<!doctype html>

<html>

<head>

? ? <meta charset="UTF-8">

? ? <title>Document</title>

<style>

*{margin:0;padding:0;}

? ? ?.head{font-size:12px;padding:6px 0 0 10px;}

? ? ?#login_box{width:300px;height:150px;background:#eee;

? ? ?border:1px solid #ccc;position:absolute;left:50%;top:50%;margin-left:-150px;margin-top:-75px;display:none;}

? ? ?#login_box p{height:20px;border-bottom:1px solid #ccc;font-size:12px;padding:6px 0 0 5px;font-weight:bold;}

? ? ?#close{width:14px;height:14px;background:url(close.png) no-repeat;position:absolute;right:4px;top:6px;}

</style>

? ? ? window.onload=function(){

? ? ? ?var login_btn=document.getElementById('login'),

? ? ? ? ? ?login_box=document.getElementById('login_box'),

? ? ? ? ? ?close=document.getElementById('close');

? ? ? ?var eventUntil={

? ? ? ? ? addHandler:function(ele,type,handler){

? ? ? ? ? ? if(ele.addEventListener){

? ? ? ? ? ? ? ele.addEventListener(type,handler,false);

? ? ? ? ? ? }

? ? ? ? ? ? else if(ele.attachEvent){

? ? ? ? ? ? ? ele.attachEvent('on'+type,handler);

? ? ? ? ? ? }

? ? ? ? ? ? else{

? ? ? ? ? ? ? ele['on'+type]=handler

? ? ? ? ? ? }

? ? ? ? ? }

? ? ? ? ? showLogin:function(login_box){

? ? ? ? ? ? login_box.style.display='block';

? ? ? ? ? }

? ? ? ? ? hideLogin:function(login_box){

? ? ? ? ? ? login_box.style.display='none';

? ? ? ? ? }

? ? ? ? }

? ? ? }

? ? ? eventUntil.addHandler(login_btn,'click',showLogin);

? ? ? eventUntil.addHandler(close,'click',hideLogin);

? ? ? ?

? ? ??

</script>

</head>

<body>

</div>

</body>

</html>

寶慕林6972327

2016-07-31

源自：DOM事件探秘 3-3

關(guān)注問(wèn)題我要回答

875

操作

收起

2 回答

寶慕林6972327 提問(wèn)者
2016-07-31

<!doctype?html>
<html>
<head>
????<meta?charset="UTF-8">
????<title>Document</title>
<style>
*{margin:0;padding:0;}
?????.head{font-size:12px;padding:6px?0?0?10px;}
?????#login_box{width:300px;height:150px;background:#eee;
?????border:1px?solid?#ccc;position:absolute;left:50%;top:50%;margin-left:-150px;margin-top:-75px;display:none;}
?????#login_box?p{height:20px;border-bottom:1px?solid?#ccc;font-size:12px;padding:6px?0?0?5px;font-weight:bold;}
?????#close{width:14px;height:14px;background:url(close.png)?no-repeat;position:absolute;right:4px;top:6px;}
</style>
<script?src="js/java.js"></script>
??<script?src="js/script.js"></script>
</head>
<body>
<div>親，您好！<input?type="button"?value="登?錄"?id="login"></div>
<div?id="login_box">
<p>用戶登錄</p><span?id="close"></span>
</div>
</body>
</html>

這個(gè)是HTML的

var?eventUntil={
??????????addHandler:function(ele,type,handler){
????????????if(ele.addEventListener){
??????????????ele.addEventListener(type,handler,false);
????????????}
????????????else?if(ele.attachEvent){
??????????????ele.attachEvent('on'+type,handler);
????????????}
????????????else{
??????????????ele['on'+type]=handler
????????????}
??????????}
??????????}

這個(gè)是java.js

window.onload=function(){alert("123")
	var?login_btn=document.getElementById('login'),
??????	????login_box=document.getElementById('login_box'),
??????	????close=document.getElementById('close');
??????	????eventUntil.addHandler(login_btn,'click',function(){
??????	????	login_box.style.display='block';
??????	????});
????????????eventUntil.addHandler(close,'click',function(){
????????????	login_box.style.display='none';
????????????});
????????}

這個(gè)是script文件

0 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

寶慕林6972327 提問(wèn)者
2016-07-31

鼓搗了以下，好像明白了，showLogin和hideLogin不應(yīng)該放在這個(gè)方法里面，最后的語(yǔ)句也寫錯(cuò)了，第三個(gè)應(yīng)該寫一個(gè)匿名函數(shù)就行了。最后我是按照視頻里面的，封裝了兩個(gè)JS文件，里面各寫不同的內(nèi)容就好了。