jquery: get value of custom attribute

html5 supports the placeholder attribute on input[type=text] elements, but I need to handle non-compliant browsers. I know there are a thousand plugins out there for placeholder but I'd like to create the 1001st.

I am able to get a handle on the input[placeholder] element but trying to get the value of the placeholder attribute is returning undefined - $("input[placeholder]").attr("placeholder").

I'm using jquery 1.6.2.

Here is the jsfiddle. I modified the code to work in a browser that is html5 compatible just for testing purposes.


<input type="text" name="email" size="10" placeholder="EMAIL ADDRESS">


function SupportsInputPlaceholder() {
    var i = document.createElement("input");
    return "placeholder" in i;

    if(!SupportsInputPlaceholder()) {
        //set initial value to placeholder attribute

        //create event handlers for focus and blur
        $("input[placeholder]").focus(function() {
            if($(this).val() == $(this).attr("placeholder")) {
        }).blur(function() {
            if($(this).val() == "") {

Thanks for any and all help, B


You need some form of iteration here, as val (except when called with a function) only works on the first element:


should be:

$("input[placeholder]").each( function () {
    $(this).val( $(this).attr("placeholder") );


$("input[placeholder]").val(function() {
    return $(this).attr("placeholder");

You can also do this by passing function with onclick event

<a onlick="getColor(this);" color="red">

<script type="text/javascript">

function getColor(el)
     color = $(el).attr('color');


Need Your Help

Are exported private keys in GPG still encrypted?

export private-key gnupg

Are the exported private keys gotten by executing gpg --export-secret-keys still encrypted and protected by their passphrase? This seems to be the case but I can't find anywhere that explicitly con...