请查看 JSFiddle:
$('#contacts .tab-content').focusout(function () {
$('#contacts .active').removeClass('active');
});
我在页面底部有一个 (Bootstrap 3) 面板,当我点击它的标签时它会弹出,当我点击它以外的任何其他地方时它会返回。为此,我将焦点放在面板上,并在失去焦点时删除 .active 类。问题是,如果我单击面板内的任何其他可聚焦元素(如输入或按钮),它也会失去焦点并触发该功能。如何在面板中包含所有元素并在没有焦点时删除 .active 类?
最佳答案
$('#contacts > .nav-tabs a').click(function() {
$('#contacts .tab-content').focus();
$('#panel').toggleClass('active');
});
$(document).click(function(e){
if(!$(event.target).closest( ".tab-content" ).length && !$(event.target).closest( ".nav-tabs a" ).length){
$('#panel').removeClass('active');
}
});
检查一次
关于Javascript 并关注后代元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28325138/