jQuery:在元素的任何其他位置单击时隐藏元素

Question

可能重复:
如何检测元素外部的单击？

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');
    }
  });
});

Answer 1

您可以采用事件委派的概念.

$(function() {
    $(document).on('click', function(e) {
        if (e.target.id === 'div1') {
            alert('Div Clicked !!');
        } else {
            $('#div1').hide();
        }

    })
});?

检查FIDDLE

通过与其他部分整合,我不明白你的意思..这是基本的想法..