如何持續檢測焦點是否已設定？（Javascript，jQuery）

我對Javascript（和jQuery）非常陌生。我的JSFiddle真的以最好的方式顯示了這個問題。 http://jsfiddle.net/mkLsr/3/如何持續檢測焦點是否已設定？（Javascript，jQuery）

我想使它成爲一個搜索框文本輸入，專注於頁面加載，因此用戶可以在不點擊的情況下鍵入它。但是，我還希望默認文本在用戶點擊文本輸入時消失，如果他們在沒有任何寫入的情況下單擊文本字段，就會重新出現。

問題是，我在頁面上有其他文本輸入，並且現在正在運行，如果用戶單擊其中一個並開始鍵入，焦點將跳轉到最初集中的文本輸入。我怎樣才能阻止這種情況發生？

我嘗試使用if ($('input:focus').size() == 0)來設置它，所以如果沒有設置其他焦點，它只會設置焦點。它不工作，因爲它不會在頁面加載後重新檢查嗎？我該如何重新檢查，還是有其他問題？

我認爲一個可以自動輸入的搜索框，其中有一個默認文本在打字後會被刪除，它的使用方式與您所能獲得的一樣友好 - 但我真的希望能夠不花錢其他輸入的用戶友好性。

任何幫助，將不勝感激！

*編輯*

凱真的幫了我與他的JavaScript的解決方案，並使用「佔位符」 HTML屬性。（http://jsfiddle.net/wgwTC/4/）。

我只是好奇，如果有人知道如何跨瀏覽器應用它，以便第一個文本輸入焦點仍然是，但佔位符文本是在那裏加載頁面。目前它在Chrome中運行，但不支持IE（我使用9）或Firefox（5.0）。如果有跨瀏覽器解決方案，它可能會幫助其他人在未來的項目中需要相同或相似的功能。

來源

2012-06-13 jporcenaluk

而不是試圖編寫自己的佔位符，請嘗試使用這樣的事情http://www.hagenburger.net/BLOG/HTML5-Input-Placeholder-Fix-With-jQuery。 html – Dhiraj

@DhirajBodicherla看起來它會工作得很好。該頁面指出，它在IE中工作，但是，我似乎無法看到IE 9中的佔位符文本。有了這樣的警告，它運作良好。對Kai這個腳本有明顯的優勢嗎？ – jporcenaluk

下面是一個使用了placeholder屬性，但將回退到JS爲IE < = 9的解決方案：（對工作示例見http://jsfiddle.net/wgwTC/2/）：

// Focus on this box by default 
$('#header-search-box').focus(); 

// Support placeholder text for IE <= 9 (which doesn't support placeholder attribute) 
if ($.browser.msie && (parseInt($.browser.version, 10) <= 9)) { 
    $('input[name=search]').attr('value', 'Search New Equipment...'); 

    // Set placeholder text on blur 
    $('input[name=search]').on('blur', function (e) { 
     if (!e.currentTarget.value.length) { 
      e.currentTarget.value = 'Search New Equipment...'; 
     } 
    });  

    // Clear placeholder text on focus 
    $('input[name=search]').on('focus', function (e) { 
     if (e.currentTarget.value === 'Search New Equipment...') { 
      e.currentTarget.value = ''; 
     } 
    }); 
}

來源

2012-06-13 18:52:16 Kai

我接受這個答案！它在Chrome中運行得非常好，在其他瀏覽器中可以很好地工作，並且對於我正在構建的應用程序而言，這樣可以很好。凱非常感謝你！ – jporcenaluk

不客氣！樂意效勞。 – Kai

我認爲這確實你問（假設我正確理解你）。

這裏的小提琴：中http://jsfiddle.net/jVvX3/2/

來源

2012-06-13 18:56:19 jnrbsn

這比我的工作更好，也就是說，它將第一個項目放在焦點上。但是，如果用戶點擊該項目，然後再次點擊而不刪除該文本，則不會自動刪除（至少在Chrome中）。不過謝謝您解決第一部分問題！ – jporcenaluk

如何持續檢測焦點是否已設定？ （Javascript，jQuery）

回答

相關問題

如何持續檢測焦點是否已設定？（Javascript，jQuery）