欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

js實(shí)現(xiàn)的點(diǎn)擊div區(qū)域外隱藏div區(qū)域

 更新時(shí)間：2014年06月30日 09:08:03   投稿：whsnow  
這篇文章主要介紹了通過js實(shí)現(xiàn)點(diǎn)擊div區(qū)域外隱藏div區(qū)域，原理及示例代碼如下

首先看下JS的事件模型，JS事件模型為向上冒泡，如onclick事件在某一DOM元素被觸發(fā)后，事件將跟隨節(jié)點(diǎn)向上傳播，直到有click事件綁定在某一父節(jié)點(diǎn)上，如果沒有將直至文檔的根。

阻止冒泡：1、stopPropagation()對(duì)于非IE瀏覽器。2、cancelBubble屬性為true，對(duì)于IE瀏覽器，

而Jquery已經(jīng)有兼容瀏覽器的方法，event.stopImmediatePropagation();

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script type="text/javascript" src="js/jquery-1.4.4.min.js" ></script>
<title></title>
</head>
<style type="text/css">
body
{
background-color:#999999;
}

#myDiv
{
background-color:#FFFFFF;
width:250px;
height:250px;
display:none;
　　　　　　}
　　</style>
<body>
<input id="btn" type="button" value="顯示DIV" />

<div id="myDiv">
This is a div;
</div>

</body>

<script type="text/javascript">
　　　　var myDiv = $("#myDiv");
$(function ()
{
$("#btn").click(function (event) 
{
showDiv();//調(diào)用顯示DIV方法
$(document).one("click", function () 
{//對(duì)document綁定一個(gè)影藏Div方法
$(myDiv).hide();
});

event.stopPropagation();//阻止事件向上冒泡
});
$(myDiv).click(function (event) 
{

event.stopPropagation();//阻止事件向上冒泡
});
});
　　　　function showDiv() 
{
$(myDiv).fadeIn();
}
</script>

相關(guān)文章

最新評(píng)論