亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

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)論