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

正確代碼來(lái)了！好多小伙伴沒(méi)有寫(xiě)關(guān)閉這的代碼

<!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');

? ? ? ?// 封裝添加事件監(jiān)聽(tīng)程序

? ? ? ? function addEvent(ele,type,hander){

? ? ? ? ? ?// 執(zhí)行代碼

? ? ? ? ? ? ? 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(){

? ? ? ?// 執(zhí)行代碼

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

? ? ? ? }

? ? ? ? // 隱藏登錄層函數(shù)

? ? ? ? function hideLogin(){

? ? ? ? ? // 執(zhí)行代碼

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

? ? ? ? }

? ? ? ? //點(diǎn)擊登錄按鈕顯示登錄層?

? ? ? ? addEvent(login_btn,'click',showLogin);

? ? ? ? // 執(zhí)行代碼

? ? ? ? //點(diǎn)擊關(guān)閉按鈕隱藏登錄層

? ? ? ? ?addEvent(login_box,'click',hideLogin);

? ? ? ? // 執(zhí)行代碼

? ? ? }?

</script>

</head>

<body>

</div>

</body>

</html>

qq圐圙2

2018-11-24

源自：DOM事件探秘 3-3

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

1006

操作

收起

1 回答

慕運(yùn)維7428119
2019-05-31

//?封裝添加事件監(jiān)聽(tīng)程序
????????function?addEvent(ele,type,hander){
???????????//?執(zhí)行代碼??
???????????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(){
????????//?執(zhí)行代碼
?????????login_box.style.display='block';
????????}
????????//?隱藏登錄層函數(shù)
????????function?hideLogin(){
??????????//?執(zhí)行代碼
??????????login_box.style.display='none';
????????}