如何测试浏览器是否支持本机占位符属性？

Question

我正在尝试为我的网站编写一个简单的占位符jQuery插件,但当然我只想在不支持本机占位符属性的情况下触发该函数...

如何使用jQuery测试占位符属性的本机支持？

Answer 1

您可以$.support通过在您编写的Javascript顶部插入此内容来轻松添加:

jQuery.support.placeholder = (function(){
    var i = document.createElement('input');
    return 'placeholder' in i;
})();

然后,您可以在代码中使用任意一个$.support.placeholder或jQuery.support.placeholder任何位置.

NB此代码改编自diveintohtml5,由hellvinz上面提供的链接.

Answer 2

使用Modernizr库,您可以在此处找到:http://www.modernizr.com/

然后这样做:

if (Modernizr.input.placeholder) {
  // your placeholder text should already be visible!
} else {
  // no placeholder support :(
  // fall back to a scripted solution
}

Modernizr非常方便用于测试浏览器对几乎所有HTML5功能的支持.