ie8及其以下版本兼容性问题之placeholder实现

1. 普通浏览器下修改placeholder颜色

因为每个浏览器的CSS选择器都有所差异，所以需要针对每个浏览器做单独的设定。

示例：

input::-webkit-input-placeholder { /* WebKit browsers */    color: red;}input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */    color: red;}input::-moz-placeholder { /* Mozilla Firefox 19+ */    color: red;}input:-ms-input-placeholder { /* Internet Explorer 10+ */    color: red;}

2. ie8下实现placeholder并控制颜色

需要预先设置颜色类，然后通过js实现

.placeholder{    color: red;}

示例：

$(function(){    if(!placeholderSupport()){   // 判断浏览器是否支持 placeholder        $('[placeholder]').focus(function() {            var input = $(this);            if (input.val() == input.attr('placeholder')) {                input.val('');                input.removeClass('placeholder');            }        }).blur(function() {            var input = $(this);            if (input.val() == '' || input.val() == input.attr('placeholder')) {                input.addClass('placeholder');                input.val(input.attr('placeholder'));            }        }).blur();    }});function placeholderSupport() {    return 'placeholder' in document.createElement('input');}

参考链接：使用CSS修改HTML5 input placeholder颜色