Question

I have an email text box that contains the text ‘(Not Required)’ until a user clicks on it, at which point it turns blank. I’m trying to make it to where if the user clicks another text box without entering an email address (or entering anything), the text box will revert to containing (Not Required).

Here’s what I have:

$(document).ready(function () {

   $('#email').val("(Not Required)");

   // this part works fine
   $('#email').click(function(){
       if ($(this).val() == '(Not Required)'){
           $(this).val('');
       }
   });

   // this isn't working
   $(':text').click(function(){
       var em = $('#email').val().length();
       if (em<3){
           $('#email').val('(Not Required)');
       }
   });

});

I can’t figure out why the second part isn’t working correctly. Any help would be rewarded with a lifetime’s devotion to yourself from myself in a very big way. Forever.

Answer 1

var em = $('#email').text().length();

Should be

var em = $('#email').val().length;

And I show you a better way do this by chain method:

$(document).ready(function () {

    $('#email').val("(Not Required)").foucs(function() {
        $(this).val('');
    }).blur(function() {
        if ($(this).val().length < 3 ){
           $(this).val('(Not Required)');
        }
    });

});