How to clear html input text box contents using jQuery

Question

I have an html text box that can be hidden.

When hiding, I want to clear the text box.

I used this and it does not work.

$('#id').val("");

And I tried $('#id').text(""); .

Removed all text field.

Answer 1

It is right:

 $('#id').val(''); 

However, your part 2 is interesting.

 $('#id').text(""); 

This should not create the behavior you describe. I expect you to refer directly to the parent object, not the <input> .

Answer 2

What else happens with your code ... because it works for me ...

 <input id="id"> <input id="clear" type="button" value="Clear"> 

and

 $('#clear').click(function(){ $('#id').val(''); }); 

Working example: http://jsfiddle.net/jasongennaro/xrxU8/

Answer 3

Assuming TheTextField is the identifier of your input field, this works fine.

 $('#TheTextField').val(""); $('#TheTextField').hide(); 

In any case, if you use FireBug and you look at the input field while you are hidden, you will see that the value attribute still has a value that it really does not have, but when you show it again:

 $('#TheTextField').val(""); $('#TheTextField').hide(); $('#TheTextField').show(); 

the input field that you see in the browser, unlike what you see in FireBug, it no longer matters.

Answer 4

Please try the following:

  $('#id').attr("value","");