停止Chrome顯示下拉列表中單擊選擇

我想點擊一個<select>時，但停止展示他的下拉列表停止Chrome顯示下拉列表中單擊選擇

$('select').click(function(){ 
    if ($(this).find('option').size() > 20) { 
     // some code to do my job 
     return false; 
    } 
});

代碼return false可以在Firefox停止下拉列表中顯示（實際上，在下拉列表稍後顯示並隱藏），但無法在Chrome中使用。

我也試着讓<select>被禁用，在其上觸發blur()，或在其他元素上觸發click()，但下拉列表仍然存在，除非用戶單擊其他地方。

這可能嗎？ ...並且謝謝！

長的故事在這裏（如果你有興趣，爲什麼我要那麼做）：

如你所知，有時會出現在它過多的 <option>一個<select>，和當你點擊它時，會出現一個長長的下拉列表。找到你需要在長長的下拉列表中是一件可怕的工作... 但不幸的是，我的網站上有很多。

所以我覺得最簡單的方法是寫一些JavaScript來改變當選項超過20，顯示帶有過濾器的對話框和新<select>只已篩選<option>讓發現很容易。

而我的問題是下拉列表仍然顯示，使我的用戶困惑......他們不知道在哪裏操作。「對話框或原點選擇」。

來源

2011-11-09 Xiong Liding

您是否嘗試過'.mousedown'並將其設置爲禁用或返回false？我認爲這不起作用，因爲你正在使用'.click'事件。 – OptimusCrime

的問題是，一個select元素的默認動作發生在mousedown事件，而不是click（或mouseup），所以你需要一個事件處理程序綁定到mousedown代替：

$("select").mousedown(function(e) { 
    if ($(this).find('option').length > 20) { 
     e.preventDefault(); //return false will also work 
    } 
});

這是working example。請注意，我使用了事件對象的preventDefault方法，只是因爲我認爲這可以更清楚地說明實際發生的事情。但是，return false也可以。

來源

2011-11-09 08:37:30

'mousedown'在Chrome中運行良好，但似乎不適用於Firefox，有什麼建議？ –

我想要禁用表格（id'details_table'）中的所有表單控件（包括選擇），並將用戶指向一個打開模式的「編輯」按鈕。對以前的答案進行小小的調整似乎可以在Linux和Firefox上使用。尚未在其他瀏覽器中進行測試。

$('#details_table').on('mousedown', '.form-control', function(e) { 
    alert("Please click on the Edit button to modify details."); 
    e.preventDefault(); 
    this.blur(); 
});

來源

2014-04-29 09:43:10 r00pert

停止Chrome顯示下拉列表中單擊選擇

回答

相關問題