帮朋友解决这个问题,我发现用以往想想像的方式来实现,貌似不太可行,所以从网上找了一些解决办法,进行优化,这篇比较详细,所以拿来备忘,另一方面也希望可以帮助需要的同学!
问题背景:jQuery事件问题!!对象 click和document click冲突问题
我想点击某个元素显示一个对象, 点击页面任意处,隐藏这个对象
//点击look对象,显示隐藏mydiv
$("#look").bind("click", function () {
$("#mydiv").toggle();
})
//点击任意地方,隐藏显示的mydiv
$(document).bind("click", function () {
if ($("#mydiv").css("display") == "block") {
$("#mydiv").hide();
}
})
这样两个事件冲突了,点击look对象,不会显示mydiv
------解决方案--------------------
防止点击事件冒泡 return false;
------解决方案--------------------
不是冲突。。是冒泡了,,
$("#look").bind("click", function (e) {
$("#mydiv").toggle();
e.stopPropagation
})
试试
------解决方案--------------------
- JScript code
$("#look").bind("click", function () { $("#mydiv").toggle(); return false; }) ------解决方案--------------------
- HTML code
$(document).bind("click", function (e) { if ($(e.target).is('#test')) return; else{ if ($("#mydiv").css("display") == "block") { $("#mydiv").hide(); } } }) ------解决方案--------------------e.stopPropagation是这个 ------解决方案--------------------
------解决方案--------------------
- JScript code
$("#look").bind("click", function () { $("#mydiv").toggle(); event.stopPropagation(); }) ------解决方案--------------------
------解决方案--------------------return false就好了.
- JScript code
<html> <head> <script type="text/javascript" src="/jquery/jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("p").click(function(){ $(this).hide(); }); $("#look").bind("click", function () { $("#mydiv").toggle(); return false; }) //点击任意地方,隐藏显示的mydiv $(document).bind("click", function () { if ($("#mydiv").css("display") == "block") { $("#mydiv").hide(); } }) }); </script> </head> <body> <div id='look'> click </div> <div id="mydiv"> <p>If you click on me, I will disappear.</p> </div> </body> </html> ------解决方案--------------------
- JScript code
$(function(){ $("#look").click(function (e) { $("#mydiv").show(); return false; }); //点击任意地方,隐藏显示的mydiv $(document).click(function () { $("#mydiv").hide(); }); });转自:http://blog.csdn.net/xudanna/article/details/51818992
来源:https://www.cnblogs.com/alsf/p/6475907.html