jQuery:在元素的任何其他地方单击时隐藏元素
可能重复:
如何检测元素外的点击?
我试图实现一个'div'隐藏,如果用户点击除了元素以外的任何地方。 如果用户点击一个按钮,我有下面的代码做toggle()。 如果'Details'元素可见,我想让按钮点击保持加,并对屏幕的其他部分作出反应。
$('.nav-toggle').click(function(){
//get collapse content selector
var collapse_content_selector = $(this).attr('href');
//make the collapse content to be shown or hide
var toggle_switch = $(this);
$(collapse_content_selector).toggle(function(){
if($(this).css('display')=='none'){
//change the button label to be 'Show'
toggle_switch.html('Show Details');
}else{
//change the button label to be 'Hide'
toggle_switch.html('Hide Details');
}
});
});
你可以诉诸事件代表团的概念。
$(function() {
$(document).on('click', function(e) {
if (e.target.id === 'div1') {
alert('Div Clicked !!');
} else {
$('#div1').hide();
}
})
});
检查FIDDLE
我不明白你的意思是与其他部分整合在一起..这是基本的想法..
你可以使用jQuery .blur()
函数来隐藏div,当用户点击其他元素时(比如link,boutton,whathever ..)
模糊事件在元素失去焦点时触发(用户选择DOM树上的另一个元素)
我不明白你的切换链接。 如果您的切换按钮管理DIV,则在切换功能的内部,您应该在div上放置hide()/ show(),同时更新按钮的文本。
链接地址: http://www.djcxy.com/p/14697.html上一篇: jQuery: Hide element on click anywhere else apart of the element