- This topic is empty.
Viewing 9 posts - 1 through 9 (of 9 total)
Viewing 9 posts - 1 through 9 (of 9 total)
- The forum ‘JavaScript’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Home › Forums › JavaScript › Add and remove label to input field
If I’m using this snippet
$('input#news-name').val( "Name" );
it will append the “Name” to my input field…. but I want it to disappear again when I click at the input field ???
Pleas help :-)
Mouse simple way is just to use the defaultValue property in the element object and some jQuery events.
$('.placeholder').each(function() {
$(this).on({
focus : function(e) {
if ($(this).val() === this.defaultValue) {
$(this).val('');
}
},
blur : function(e) {
if ($(this).val() !== this.defaultValue) {
$(this).val(this.defaultValue);
}
}
});
});
You can see it in action here
have you heard of the placeholder attribute?
Check out this article. Look for the title “Placeholder functionality fallback – jQuery with Modernizr”. If you have Modernizr included and the placeholder attribute applied to the input elements it will work well for everyone.
@SgtLegend
Hi …. and thanks
I’m working on a Drupal 7 website with jQuery 1.4 …. and I think your solution required jQuery 1.7 ???
Simply change the on method to bind and it will work the exact same way
wauw …… you just saved my day :-)
@jamy_za
And thanks to you …. :-)
@SgtLegend
Ups ….. now I can’t use the inputs ….. the script also remove what I write in the input fields
Yep anything you enter gets removed on loss of focus and also if javascript is disabled then you have to manually remove the content before typing inside which is annoying as hell for the user.
Just using
will work on all html5 browsers? I am guessing you’re looking for a wider range than that?