ホームページ > 記事 > ウェブフロントエンド > js之点击超连接,提示一个层.点击空白层消失_javascript技巧

js之点击超连接,提示一个层.点击空白层消失_javascript技巧

WBOYオリジナル: 2016-05-16 19:13:36922ブラウズ

请教一下.点击超连接,提示一个层.点击空白.层消失.

原生js版

BODY {

BACKGROUND: #fff; FONT: 76%/1.5 Arial,sans-serif; COLOR: #333

}

input{

width:200px;border: 1px solid #86B9D6;

}

#reg_div{

color: #154BA0;

border: 1px solid #86B9D6;

background: #D9EEF9;

position: absolute;

z-index: 30;

height: 180px;

width:400px;

}

.city{

width:80px;

float:left;

padding:8px;

text-align:center;

}

.ps_div{

padding:10px 10px 2px 10px;

border-bottom:1px dotted #ccc;

}

</style>

function oo(obj){

return typeof(obj)=="string"&#63;document.getElementById(obj):obj

}

function allt(id){

e=oo(id)

var et=e.offsetTop;

var el=e.offsetLeft;

while(e=e.offsetParent){

et+=e.offsetTop;

el+=e.offsetLeft;

}

oo("reg_div").style.left=(el) + "px";

oo("reg_div").style.top=(et+20) + "px";

oo("reg_div").style.display='';

//                oo("reg_div2").innerHTML=id;    //    娣诲姞鎻愮ず淇℃伅(鏍规嵁id鍒ゆ柇)

//     oo("reg_div").style.display='none';

}

function bllt(id){

oo("input_01").value=oo(id).innerHTML

oo("reg_div").style.display='none';

}

</script>

function Object_Onclick(){

if(document.activeElement.id!="input_01"){

//    alert("dd")

oo(reg_div).style.display='none';

}

window.document.onclick= Object_Onclick;

</script>

<div class="ps_div">
<span style="float:right;" onclick="oo('reg_div').style.display='none'">鍏抽棴</span>鏌ユ壘鎻愮ず:</div>

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

前の記事：javascript之对系统的toFixed()方法的修正_javascript技巧次の記事：“增强js程序代码的健壮性”之我见大量示例代码_javascript技巧

続きを見る

js之点击 超连接,提示一个层.点击空白层消失_javascript技巧

関連記事

js之点击超连接,提示一个层.点击空白层消失_javascript技巧