隱藏模糊的自動完成AJAX控件的建議列表

我正在實現一個AJAX「自動建議」框：用戶在輸入文本字段中鍵入字符串，顯示帶有表格的隱藏div，然後他/她可以點擊一行或使用向上/向下箭頭滾動列表;同時，重點仍然放在輸入文本字段上。隱藏模糊的自動完成AJAX控件的建議列表

一切工作都很好，但有一個細節我不能實現，這似乎在概念上很難甚至是不可能的。我想在用戶將光標移動到另一個輸入字段時隱藏建議列表，或者只是單擊窗口的空白點。這本身並不難實現，我只是加了一個Calback OnBlur;但是這打破該項目的OnClick的選擇，因爲onblur事件被觸發之前的點擊，然後onclick事件被觸發之前的DIV消失......

我想過上實現一個onclick回調整個窗口，然後檢查點擊發生的位置，但這看起來有點太尷尬和扭曲。有人有更好的主意嗎？謝謝！

來源

2011-05-05 Francesco Marchetti-Stasi

你有沒有想出解決辦法？我現在有這個問題，並不能找出一個很好的解決方案，讓onBlur沒有打破清除或鼠標點擊選擇觸發... – kgstew 2016-02-05 02:05:57

我目前正試圖解決同樣的問題。

部分解決：

使用功能等待幾分之一秒清除自動提示DIV

function pause(milliseconds) { 
     var dt = new Date(); 
     while ((new Date()) - dt <= milliseconds) { } 
} 

onBlur="pause(500);clearAutosuggestBox()"

然而之前，這個解決方案是不優雅，它不會在所有的瀏覽器。

在尋找一些流行的autosuggest盒子時，我沒有遇到過一個讓你在外面點擊時自動提示信息消失的問題，而他們通常會超時消失。

祝你好運。

來源

2011-05-05 19:07:19

我同意，它不是很優雅，仍然不那麼尷尬，比我更容易在完整的窗口上的「onclick」的想法... 爲什麼你認爲它不會在所有的瀏覽器工作？... – 2011-05-06 11:55:31

嗨，剛剛看到你的迴應...嗯，我試了幾天這個解決方案以前，它似乎適用於除一個之外的所有瀏覽器（對不起，我不記得是哪一個）......而且，如果某人的電腦速度較慢，那麼暫停時間必須更長。 – 2011-05-09 02:47:03

我有一個問題simular但有點不同的解決方案中提出了：

document.onclick = closeSuggest; 
function closeSuggest() { 
    document.getElementById('suggestions').style.display = "none"; 
} 

function catchTAB(event) { 
    if(event.keyCode ==9) { 
    closeSuggest(); 
    document.getElementById('ELEMENT').focus(); //the element that is currently focused 
    } 
}

希望這有助於

來源

2011-06-22 05:18:58 Jeff

我工作的同樣的問題，並與下面的解決方案上來。 Autosuggest列表隱藏onclick也在IE中工作的文件（window.onclick在IE中不起作用）。

document.onclick = function(ev) 
{ 
    this.hideAutosuggestListDiv(); 
}; 

this.hideAutosuggestListDiv = function() 
{ 
    this.div.style.display = 'none'; 
};

來源

2012-10-17 07:21:28 user1688640

對於那些使用jQuery的focusout事件觸發完全適用此：

$('#input-box').focusout(function() { 
    $('#suggestions').fadeOut(); 
});

來源

2014-02-08 15:38:05

隱藏模糊的自動完成AJAX控件的建議列表

回答

相關問題