I am trying to get the placeholder
attribute value and do a fadeIn
with the label which has the placeholder
value as a for
value, but it's not working.
HTML:
<html>
<body>
<form>
<input type="text" id="name" name="name" placeholder="First Name" />
<label for="First Name">First Name </label>
</form>
</body>
</html>
CSS:
input+label { display: none; }
Script
$(document).ready(function() {
$('input[type="text"]').click(function() {
var sd = $(this).attr('placeholder');
$('label[for^=sd]').fadeIn();
});
});
A jQuery plugin that enables HTML5 placeholder behavior for browsers that aren't trying hard enough yet. 4k.
You just need this: $(". hidden"). attr("placeholder", "Type here to search");
The placeholder text, although it appears in the same place as the value, is not a value. It is never submitted, and only shows up if there is no value.
The placeholder attribute specifies a short hint that describes the expected value of a input field / textarea. The short hint is displayed in the field before the user enters a value.
You are selecting with the literal string "sd", not the value of your variable. Try this:
var sd = $(this).attr('placeholder');
$('label[for^="' + sd + '"]').fadeIn();
This works:
$('label[for^="' + sd + '"]').fadeIn();
Try it http://jsfiddle.net/hwJy8/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With