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

下一篇: Set select option 'selected', by value