JQuery: Input field: select all input on focus

Question

Right now on focus the input field simply hides the clear search button. What do I need to add on the focus event to highlight the value in the input field so when a user clicks on the input field the text already in there from the previous search is selected?

$('input.query').on('focus',function(){
    $("#searchx").hide();
});
$('input.query').on('blur',function(){
    $("#searchx").show();
});

see http://stackoverflow.com/questions/480735/select-all-contents-of-textbox-when-it-receives-focus-javascript-or-jquery — Kenny Thompson, Sep 09 '13 at 17:04

score 0 · Answer 1 · answered Sep 09 '13 at 17:07

0

Answer: add this to the focus event:

$(this).select();

answered Sep 09 '13 at 17:07

oceanic815

483
2
9
20

score 0 · Accepted Answer · answered Sep 09 '13 at 17:10

If you are concerned about cross browser functionality this will work better,

$(document).ready(function() {
    $("input.query")
        .focus(function () { 
             $("#searchx").hide();
             $(this).select(); 
        }).mouseup(function (e) {e.preventDefault(); });
});

JQuery: Input field: select all input on focus

2 Answers2