DIV外区域Click后关闭DIV的实现代码_Javascript教程-查字典教程网
DIV外区域Click后关闭DIV的实现代码
DIV外区域Click后关闭DIV的实现代码
发布时间:2016-12-30 来源:查字典编辑
摘要:阻止冒泡:1、stopPropagation()对于非IE浏览器。2、cancelBubble属性为true,对于IE浏览器,而Jquery...

阻止冒泡:

1、stopPropagation()对于非IE浏览器。

2、cancelBubble属性为true,对于IE浏览器,

而Jquery已经有兼容浏览器的方法,event.stopImmediatePropagation();

复制代码 代码如下:

<style>

body

{

background:black;

}

#myDiv

{

background: #fff;

width:250px;

height:250px;

display:none;

}

</style>

<div id="myDiv">

This is a div;

</div>

<input id="btn" type="button" value="显示DIV" />

<script type="text/javascript">

var myDiv = $("#myDiv");

$(function () {

$("#btn").click(function (event) {

showDiv();//调用显示DIV方法

$(document).one("click", function () {//对document绑定一个影藏Div方法

$(myDiv).hide();

});

event.stopPropagation();//阻止事件向上冒泡

});

$(myDiv).click(function (event) {

event.stopPropagation();//阻止事件向上冒泡

});

});

function showDiv() {

$(myDiv).fadeIn();

}

</script>

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类