Delete content of input field jQuery

Question

I know others have asked about this. And I have tried the solutions that others have recommended, but it doesn't seem to work.

Here is my code:

<!DOCTYPE HTML>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script type='text/javascript'>
$('input:text').focus(
    function(){
        $(this).val('');
});
</script>
</head>
<body>
<form>
<input type="text" value="Text">
</form>
</body>
</html>

I recommend to read a basic jQuery tutorial which explains how to set up jQuery: http://learn.jquery.com/about-jquery/how-jquery-works/. — Felix Kling, Aug 26 '13 at 14:37
@SpotifyBruger, that error is not related with the code you posted... please post full code. — Sergio, Aug 26 '13 at 14:38
You are never trying to call `sendMessage` in your code, so I cannot tell you why you get that error. — Felix Kling, Aug 26 '13 at 14:38

score 3 · Answer 1 · answered Aug 26 '13 at 14:35

Your problem is that when the jQuery code runs the html is not there yet. So you need to run the jQuery only when the page loaded, or post that script just before the <body> closing tag.

Option 1 (add a DOM ready call to yor function):

$(document).ready(function() {
    $('input:text').focus(function() {
        $(this).val("");
    });
});

Option 2 (to add the <script> before the closing of body tag)

<!DOCTYPE HTML>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>
<form>
<input type="text" value="Text">
</form>
<script type='text/javascript'>
$('input:text').focus(
    function(){
        $(this).val('');
});
</script>
</body>
</html>

It works, thank you so much! – Spotify Bruger Aug 26 '13 at 14:40 — Spotify Bruger, Aug 26 '13 at 14:40
@SpotifyBruger, mark this answer as correct – Satpal Aug 26 '13 at 14:57 — Satpal, Aug 26 '13 at 14:57

score 2 · Answer 2 · answered Aug 26 '13 at 14:32

2

You want to do something more along the lines of

$(function() {
    $('input:text').focus(function() {
        $(this).val("");
    });
});

without the $(function() {... it is possible that you are trying to fire jQuery before it has loaded.

answered Aug 26 '13 at 14:32

GaryDevenay

2,320
2
18
39

Still doesn't work. Get this error in console: Uncaught TypeError: Object # – Spotify Bruger Aug 26 '13 at 14:37
That isn't an error related to this issue. We are not calling the method sendMessage here. This must be a javascript error from elsewhere in your application. – GaryDevenay Aug 26 '13 at 14:38

Delete content of input field jQuery

2 Answers2