jquery：获取自定义属性的值

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.

html5支持input [type = text]元素的占位符属性，但我需要处理不兼容的浏览器。我知道有一千个插件用于占位符，但我想创建1001。

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").

我能够获得输入[placeholder]元素的句柄，但是尝试获取占位符属性的值是返回undefined - $（“input [placeholder]”）。attr（“placeholder”）。

I'm using jquery 1.6.2.

我正在使用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.

这是jsfiddle。我修改了代码以在兼容html5的浏览器中工作，仅用于测试目的。

html

HTML

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

jquery

jQuery的

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

$(document).ready(function(){
    if(!SupportsInputPlaceholder()) {
        //set initial value to placeholder attribute
        $("input[placeholder]").val($("input[placeholder]").attr("placeholder"));

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

Thanks for any and all help, B

谢谢你的帮助，B

2 个解决方案

#1

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

这里需要某种形式的迭代，因为val（除了使用函数调用时）仅适用于第一个元素：

$("input[placeholder]").val($("input[placeholder]").attr("placeholder"));

should be:

应该：

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

要么

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

#2

You can also do this by passing function with onclick event

您也可以通过onclick事件传递函数来完成此操作

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

<script type="text/javascript">

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

</script>

#1