jQuery隱藏焦點除外，除非某些div被點擊

我有一個div，當您鍵入到文本框中時彈出一個項目列表。jQuery隱藏焦點除外，除非某些div被點擊

關於文本框的模糊我隱藏了項目列表。

但是，由於focusout事件首先觸發，因此我不再觸發項目上的點擊事件。

我想要的是隱藏模糊列表，除非列表中的項目已被點擊。

有沒有人知道一種方式？

在提問時，它應該與本網站的標籤部分相同。

來源

2010-11-16 griegs

爲什麼不看Stack Overflow如何實現它？他們也使用jQuery。 – 2010-11-16 02:56:27

@Matt他們實際上使用了一個插件。一個過時的，確切地說 - http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/ – 2010-11-16 02:59:33

謝謝@Yi Jiang – griegs 2010-11-16 03:00:37

使用jQuery 1.6或更高版本，您可以使用：focus選擇器來查看您的div在隱藏div之前是否有任何具有焦點的子級。

$("#textboxID").blur(function() { 
    if ($("#divID").has(":focus").length == 0) { //if you click on anything other than the results 
     $("#divID").hide(); //hide the results 
    } 
});

更新：原來，只有在IE工作。這是一個更好的解決方案，雖然對於任務有點複雜。 http://jsfiddle.net/cB2CN/

var resultsSelected = false; 
$("#ResultsDIV").hover(
    function() { resultsSelected = true; }, 
    function() { resultsSelected = false; } 
); 

$("#TextBox").blur(function() { 
    if (!resultsSelected) { //if you click on anything other than the results 
     $("#ResultsDIV").hide(); //hide the results 
    } 
});

來源

2012-01-23 22:35:14 Paul

太好了，謝謝。有點陳舊這個問題，但無論如何謝謝你。 :) +1，我想我也會接受 – griegs 2012-01-24 02:25:00

這不適合我（長度始終爲0），但這是一個好主意：/ – 2013-08-28 13:26:31

@ jave.web試試IE，我打賭你會看到一個不同的結果。我在FF/Chrome/Safari中也發現了這個問題，併發布了一個關於它的新問題。 http://stackoverflow.com/questions/10391823/jquery-hasfocus-in-ff-chrome-safari – Paul 2013-08-28 18:26:43

我正在爲我建立一個web應用程序的自定義搜索引擎。這是我爲類似問題提出的解決方案。據我所知，它適用於所有瀏覽器。

$(document).ready(function() { 
    $('#inputBox').focusout(function() { 
     $('#resultsDiv').hover(
      function() {   
       return; 
      }, 
      function() { 
       $('#resultsDiv').fadeOut('slow'); 
       $('#resultsDiv').html(''); 
      }); 
    }); 
});

我將模糊方法更改爲focusout（必須全部小寫，focusOut不起作用）。 .hover事件有兩個條件：對或錯。如果第一個函數爲真（如果用戶懸停在結果上），則觸發第一個函數，如果用戶沒有將鼠標懸停在結果上，則觸發第二個函數。

我遇到的唯一「問題」是，當用戶超出#resultsDiv時，它會淡出。我會在它周圍添加一些清晰的填充，以確保用戶不會意外出現在外面。

來源

2013-11-12 00:36:36

jQuery隱藏焦點除外，除非某些div被點擊

回答

相關問題