Can't change defaultValue attribute of input using jQuery

Question

I have some onfocus/onblur handlers for a field that clears the default contents when focused, but only if the value equals the default value (so as to not remove any user input).

The field can also toggle between inputs. So rather than accepting a username, the user could click a button and it would accept an email address. This would require a different default value, such as "enter your email address". The actual property attribute defaultValue needs to be changed to allow my focus/blur handlers to work properly, using something like this:

$('input#ident-field').prop('defaultValue', 'enter your email address');

This doesn't seem to work because if you focus the field when it asks for an email address it doesn't clear it.

read about .prop() : It should be used when setting selectedIndex, tagName, nodeName, nodeType, ownerDocument, defaultChecked, or defaultSelected. — xkeshav
– xkeshav, Commented Apr 25, 2012 at 6:15
So not defaultValue? Either way, I've tried .attr() and .prop() and neither are working. — Matt
– Matt, Commented Apr 25, 2012 at 6:17
see my answer; if still you wants to go with jQuery then use .data() instead — xkeshav
– xkeshav, Commented Apr 25, 2012 at 6:20

xkeshav · Accepted Answer · 2012-04-25 06:18:41Z

4

Your shoud use HTML 5 attribute placeholder

<input type="text" placeholder="Enter Your email address" / >

answered Apr 25, 2012 at 6:18

xkeshav

54.2k47 gold badges183 silver badges255 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

ThiefMaster Over a year ago

You'll also want to add github.com/mathiasbynens/jquery-placeholder to make it work in older browsers.

Chinmaya003 · Accepted Answer · 2012-04-25 06:22:29Z

0

You can do this with the use of focus and blur functions:

$('input#ident-field').val("enter your email address");
// or $('input#ident-field').prop('defaultValue', 'enter your email address');
$('input#ident-field').focus(function(){
    $(this).val("");
});
$('input#ident-field').blur(function(){
    if($(this).val().trim() == "")
    {
        $(this).val("enter your email address");
    }
});

answered Apr 25, 2012 at 6:22

Chinmaya003

4863 silver badges11 bronze badges

Collectives™ on Stack Overflow

Can't change defaultValue attribute of input using jQuery

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related