A Web Design Community curated by Chris Coyier

A little dab'll do ya

Code Snippets

Home » Code Snippets » jQuery » Set/Clear Default Input Value Submit one!

Set/Clear Default Input Value

$('.default-value').each(function() {

       var default_value = this.value;

       $(this).focus(function(){
               if(this.value == default_value) {
                       this.value = '';
               }
       });

       $(this).blur(function(){
               if(this.value == '') {
                       this.value = default_value;
               }
       });

});

Subscribe to The Thread

  1. kartofelek says:

    This is very old snippet. Now you better use placeholder or equiwalent. And one important thing – whats about send value? You set the default, but sometimes this is wrong.

  2. Jason Day says:

    With my form, I have fields that are not required but have pre-filled value text as a usability hint. Several of these fields go through various types of validation (right number of characters, etc).

    How would i clear only the default value of those specific fields?

    example:

    <input value="Enter promotion code" maxlength="40" title="Promotion Code 1">

    I need to clear the “Enter promotion code” on submit so that the value doesn’t go through validation and trigger an alert.

It's Your Turn

At this moment, you have an awesome opportunity* to be the person your mother always wanted you to be: kind, helpful, and smart. Do that, and we'll give you a big ol' gold star for the day (literally).

Posting tips:
  • You can use basic HTML
  • When posting code, please turn all
    < characters into &lt;
  • If the code is multi-line, use
    <pre><code></code></pre>
Thank you,
--- The Management ---