當另一個選項關注時，保持輸入焦點？

我有一個簡單的搜索表單，包含兩個輸入。一個文本輸入和一個選擇輸入。當另一個選項關注時，保持輸入焦點？

文本輸入爲全寬，並且選擇輸入被絕對定位，因此它位於文本輸入的右側，並用作段過濾器。這裏

例子我試圖做的是保持被選擇的選擇元素時，文本輸入聚焦。目前，您可以專注於文本輸入，但是當您選擇選擇選項時，搜索/文本輸入失去焦點，這意味着您不能僅僅擊中搜索。

我假設這是可以解決的一個小jQuery。我發現了一些例子，當你點擊輸入時，將保持輸入聚焦（或重新調整它），但我只希望它在選擇選擇時保持焦點。希望這是有道理的？

標記是這樣的...

<div id="search" class="global-search"> 

    <form class="global-search-form" method="post"> 

     <input type="search" placeholder="Search..."> 

     <div class="search-select"> 
      <span>in</span> 
      <select name="select-category"> 
       <option value="all-categories">Everything</option> 
       <option value="category1">Category 1</option> 
       <option value="category2">Category 2</option> 
      </select> 
     </div> 

    </form> 

</div>

來源

2016-05-16 shorn

這是最簡單的黑客你可以做的：https：//jsfiddle.net/DinoMyte/cuza0ugo/ – DinoMyte

謝謝你。在Chrome瀏覽器中遇到問題了嗎？我發現'$（'select'）。focus（function（）{（'input'）。focus（）; }）;'也工作得很好。 – shorn

您將專注於選擇問題，因爲它會避免從該選擇中選擇一個選項。嘗試使用點擊或改變。 – DinoMyte

你真的不能保持文本輸入焦點，而聚焦的選擇，但你可以在變化重新調整：

$('[name=select-category]').on('change', function(){ 
    $("[type=search]").focus(); 
});

https://jsfiddle.net/obbthcfp/

來源

2016-05-16 23:31:03

謝謝你。根據我上面的評論，我發現select元素上的焦點事件也做到了這一點。 – shorn

啊，沒有刷新看到評論，因爲我寫了我的答案。哎呀...好看的鏡頭！好球！好球！（對不起，由於某種原因，火箭聯盟閃現）。 –

當另一個選項關注時，保持輸入焦點？

回答

相關問題