web-dev-qa-db-ja.com

div全体と子のjQueryフォーカスアウト

いくつかのリンク/ボタンを含むjQueryを介して動的に作成しているdivがあります。このdivがフォーカスを失ったとき、私はそれを削除する必要があります。この部分は大丈夫です。

ただし、現在、divのラッパーにfocusoutイベントがあり、div内のボタンをクリックすると、ラッパーが子にフォーカスを失い、イベントが発生します。クリックされた要素がラッパーの子であるかどうかを確認できますが、ラッパーにフォーカスがないため、divを削除するためにイベントが再度発生することはありません。

.blurも試しましたが、これ以上うまくいきません。

これを行うための最良の方法は何ですか？

jqueryjquery-focusout
12
Helto
_$("#yourDiv").focusout(function () {
   if ($(this).has(document.activeElement).length == 0) {
       // remove div
   }
});
_

$(this) =フォーカスしているdiv。

_document.activeElement_ =現在フォーカスされている要素。

$(this).has(document.activeElement)は、アクティブな要素がdivの子であるかどうかを確認するだけです。

16
Isaac

プレーンなJavaScriptでこれを解決する方法は、イベント引数で指定されたrelatedTargetを使用することです。

element.addEventListener('focusout', function(event) {
    if (element.contains(event.relatedTarget)) {
        // don't react to this
        return;
    }
    // do something
});
10
Stefan Hessler