这类似于facebook和google通知按钮,在它们上单击它们并弹出一个窗口,如果再次单击该按钮或单击不属于通知div的任何部分,则将关闭。
我的问题是我找不到取消单击对象或单击对象的事件。
这就是我现在所拥有的,如果您再次单击该按钮,则只能关闭弹出的窗口。
notifycounter.click(function() {
return imagepanel.toggle();
});
这是我尝试过的方法,但均未触发任何事件:
notifycounter.focusin(function() {
return imagepanel.toggle();
});
notifycounter.focusout(function() {
return imagepanel.hide();
});
通知柜台是H3
图片面板是img
最佳答案
尝试这个。
notifycounter.click(function(e) {
imagepanel.toggle();
e.stopPropagation();//this will stop the event bubbling
});
$(document).click(function(){
if(imagepanel.is(':visible')){
imagepanel.hide();
}
});
您可以像这样优化它。
notifycounter.click(function(e) {
imagepanel.toggle();
e.stopPropagation();//this will stop the event bubbling
if(imagepanel.is(':visible')){
$(document).one('click.imagepanel', function(){
imagepanel.hide();
});
}
else{
$(document).unbind('click.imagepanel');
}
});