onFocus does not remove value input text box

Question

If I use this: <input class="search" type="text" id="input" onfocus="this.value=''" /> and I write for example: arduino and it searches for everything with the text arduino and after that I click on somewhere else on the webpage and then click on the input field again, the text clears out as it should, but I have to backspace once on my keyboard, to clear the results for arduino and show everything.

Why and how can I fix this? Thanks

jsfiddle code here

score 2 · Accepted Answer · answered Jun 30 '13 at 09:49

2

Trigger the keyup handler onfocus:

http://jsfiddle.net/dErda/1/

$('#input').on('focus',function(){
        this.value='';
        $(this).keyup();
    });

answered Jun 30 '13 at 09:49

A. Wolff

74,033
9
94
155

Awesome! It works thanks, I'll mark this as the solution in 6 min – MOTIVECODEX Jun 30 '13 at 09:52
Another question, can you help me out with this? http://stackoverflow.com/questions/17389405/remove-icon-for-input-with-css-and-jquery thanks :) – MOTIVECODEX Jun 30 '13 at 10:28

score 1 · Answer 2 · answered Jun 30 '13 at 09:58

1

Try this to clear search and show everything back:

$("input[type=text]").focus(function(){
  $(this).val('');    
    $('.input').hide();
     $("ul.filter li").show();
});

answered Jun 30 '13 at 09:58

vendettamit

14,315
2
32
54

onFocus does not remove value input text box

2 Answers2