html5支持input [type = text]元素的占位符属性,但我需要处理不兼容的浏览器.我知道有一千个插件用于占位符,但我想创建1001.
我能够获得输入[placeholder]元素的句柄,但是尝试获取占位符属性的值是返回undefined – $(“input [placeholder]”).attr(“placeholder”).
我正在使用jquery 1.6.2.
这是jsfiddle.我修改了代码以在兼容html5的浏览器中工作,仅用于测试目的.
HTML
<input type="text" name="email" size="10" placeholder="EMAIL ADDRESS">
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"));
}
});
}
});
感谢您的帮助,
乙
解决方法
这里需要某种形式的迭代,因为val(除了使用函数调用时)仅适用于第一个元素：
$("input[placeholder]").val($("input[placeholder]").attr("placeholder"));
应该：
$("input[placeholder]").each( function () {
$(this).val( $(this).attr("placeholder") );
});
要么
$("input[placeholder]").val(function() {
return $(this).attr("placeholder");
});