jquery - jQuery:テーブルの行がいつフォーカスを失ったかを知る方法は?

Question

表の行 ( <tr>) には、いくつかの入力要素があります。

tr がフォーカスを失ったときに JavaScript コードを実行する必要があります (ただし、ユーザーが同じ tr 内の別の入力要素に切り替えたときは必要ありません)。

jQueryを使用しています。

クロスブラウザで行うには？

Answer 1

このアプローチを探していると思います（demo、 Chr/Ff/IE10 でチェック）：

var delayedFn, blurredFrom;
$('tr').on('blur', 'input', function(event) {
    blurredFrom = event.delegateTarget;
    delayedFn = setTimeout(function() {
        console.log('Blurred');
    }, 0);
});
$('tr').on('focus', 'input', function(event) {
    if (blurredFrom === event.delegateTarget) {
        clearTimeout(delayedFn);
    }
});

ご覧のとおり、「真のぼかしハンドラー」(console.logこの例では関数)の呼び出しを遅延させsetTimeout、フォーカスが同じ行に留まっている場合は、このタイムアウトをクリアします。

closest(tr)ここでは委任を使用するため、毎回呼び出す必要はありません。ただし、ハンドラーはテーブルに動的に追加された入力を正しく処理するため、別の副作用があります。