2012-11-14 11 views
5

HTMLjQuery .focus() jest wyróżnianie wszystkich wstępnie wypełniony tekst

<input id="formloginusername" type="text" name="username" placeholder="Username" value="Pre-filled-from-database"></input> 

JS:

$(document).ready(function() { 
    $("#formloginusername").focus(); 
}); 

Problem:

Tekst "Pre-wypełnione od wewnątrz bazy danych" jest podświetlony. Chcę, aby kursor pokazywał się w polu tak, jakby użytkownik kliknął go po wypełnionym tekście.

Dzięki!

+1

To byłoby domyślne zachowanie przeglądarek. – adeneo

+0

Zgadzam się z adeneo, poza tym nie trzeba wstawiać tagu zamykającego na wejściu jak to ... zamiast tego, zamknij wejście tak, jak to VIDesignz

Odpowiedz

14

Oto sprytny mały trick ...

$(document).ready(function() { 
    var $field = $("#formloginusername"), 
     oldVal = $field.val(); 
    $field.focus().val('').val(oldVal); 
}); 

DEMO: http://jsfiddle.net/X7Y8S/

+1

Perfect! Dzięki! – GiantDuck

+0

To jest fantastyczny przykład, dziękuję. Pytanie brzmi: teraz przechodzisz na swoją stronę i koncentrujesz się, ale mówisz jak użytkownik zaczynasz pisać: nie usuwa tekstu, tylko go dodaje. Tj. Twoja wartość to "szukaj tutaj!" wpisujesz "szkolne podręczniki matematyki", byłoby to "szukaj tutaj! Jak tego uniknąć? EDYCJA: $ ("input.search-input-header") [0] .reset(); działa dobrze, ale tylko wtedy, gdy klikniesz. W jaki sposób ustawiasz ostrość i kiedy zaczynasz pisać, czyścisz? – DnfD

+1

@DavidPardy - Jeśli nie martwisz się o starsze przeglądarki, uważam, że opisujesz domyślne zachowanie atrybutu "placeholder". ' ' – ahren

0

tylko będzie to zrobić:

$('#field').focus().val($("#field").val()); 
0

Hopstream, co znalazłem w Chrome przy użyciu metoda jest kursor zakończył się na końcu tekstu. Potrzebowałem sposobu, aby ustawić kursor na początku pola bez podświetlania tekstu. . Ten pracował dla mnie:

$ ('# ElementID') każda (function() { $ (this) .focus(); this.selectionEnd = this.selectionStart; });