javascript - リンクをクリックすると、バインドの「ぼかし」を停止します

Question

私のバインド関数：

$searchInput.bind('blur', function() {
  $searchResults.remove();
}

しかし、$ searchResults内のリンクをクリックしても、これは発生しないはずです。リンクをクリックする前に$searchResultsが削除されました。どうすればいいですか？

Answer 1

マウスオーバーでフラグを設定するだけです$searchResults：

var isOver = false;
$searchInput.bind("blur", function(e) {
    if (!isOver) {
        $searchResults.remove();
    }
});

$searchResults.hover(function() {
    isOver = true;
}, function() {
    isOver = false;
});

デモ: http://jsfiddle.net/sUA4D/

setting などの要素データを介して同じことを行うことができます$searchResults.data("isOver", true)。

Answer 2

頭に浮かぶ 1 つのオプションは、次の$.remove()ように呼び出しの実行を遅らせることです。

$searchInput.bind('blur', function() {
    setTimeout(function() {
        $searchResults.remove();
    }, 100);
}

Answer 3

$searchInput.find('a').on('click', function() {
  $searchResults.remove();
});