Javascript關閉彈出div

Question

我有一個用onclick隱藏/顯示的div ，它添加或刪除了css class 。 當用戶在div區域之外單擊時，我希望能夠關閉/隱藏div 。

我該怎么做呢？ 謝謝！

Answer 1

我認為您正在尋找的可以使用JavaScript完成。 它是一個名為“ onBlur”的事件，當某件事失去焦點時（例如您的div），它將觸發事件處理程序。

您可以在此處了解更多信息： http : //www.w3schools.com/jsref/event_onblur.asp

基本上，當對象失去焦點時，您將調用JavaScript函數：

onBlur="myFunction();"

...和“ myFunction（）”將具有用於更改CSS的JavaScript。

Answer 2

如此處所述-https : //stackoverflow.com/a/7385673/1982631

的HTML

<div class="block">
      <div class="blockelements">

      </div>
    </div>

jQuery-

$(document).bind('click mouseup blur',function (e)
{
    var container = $(".block");

    if (!container.is(e.target) // if the target of the click isn't the container...
        && container.has(e.target).length === 0) // ... nor a descendant of the container
    {
        container.hide();
    }
});

演示-https : //jsfiddle.net/up6g5rqL/1/