How can I change this with jquery?

I want to change the text value in the search box to say, for example, "Awesome Search." I know it can be done with Jquery but I can`t get it to work. Can you assist?

Note, this is the default provided by Wordpress, and it would 开发者_StackOverflowbe difficult (for me) to go in and edit the files to separate the content from the behavior, so I need Jquery to override the default. The two answers provided thus far don`t seem to do that.

<input type="text"
       onblur="if (this.value == '') {this.value = 'To search, type and hit enter';}"
       onfocus="if (this.value == 'To search, type and hit enter') {this.value = '';}"
       id="s"
       name="s"
       value="To search, type and hit enter"
       class="text_input">

---

So it seems you simply want to replace the default value of the textbox when the page loads, without modifying the HTML, and hence using jQuery...

$(function () {
    $('#s').val('Awesome Search');
});

---

First, since you are using jQuery: Get your code out of your markup. Put this in the head of your document:

<script type="text/javascript">
    $(function() {
        var s = $('#s');
        s.blur(function() {
            if (s.val() === '') {
                s.val('To search, type and hit enter');
            }
        }).focus(function() {
            if (s.val() === 'To search, type and hit enter') {
                s.val('');
            }
        });

    });
</script>

Then in the body

<input type="text"
       id="s"
       name="s"
       value="To search, type and hit enter"
       class="text_input" />

Then you need to bind to your form submit. Are you doing an ajax call? It will look something along the lines of:

$('#theFormId').submit(function(e) {
    e.preventDefault();
    // do your ajax stuff.
    // in the callback:
    $('#s').val('Awesome Search.');
});

---

The input:

<input type="text" id="s" name="s" value="To search, type and hit enter" class="text_input">

And the jQuery:

$('#s').focus(function() {
    if ($(this).text() == 'To search, type and hit enter'){
        $(this).text('');
    }
}

$('#s').blur(function() {
    if (strlen($.trim($(this).text())) == 0){
        $(this).text('To search, type and hit enter');
    }
}