Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I get placeholder attribute value using jquery?

Tags:

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();  
    });  
});
like image 828
Suresh Pattu Avatar asked Dec 07 '11 13:12

Suresh Pattu


People also ask

What is jQuery placeholder?

A jQuery plugin that enables HTML5 placeholder behavior for browsers that aren't trying hard enough yet. 4k.

How can add placeholder in textbox using jQuery?

You just need this: $(". hidden"). attr("placeholder", "Type here to search");

Is placeholder a value?

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.

What does placeholder attribute specify?

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.


2 Answers

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();
like image 119
FishBasketGordo Avatar answered Oct 13 '22 10:10

FishBasketGordo


This works:

$('label[for^="' + sd + '"]').fadeIn();

Try it http://jsfiddle.net/hwJy8/

like image 38
PiTheNumber Avatar answered Oct 13 '22 09:10

PiTheNumber