.invalid:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: red; } .invalid::-moz-placeholder { /* Mozilla Firefox 19+ */ color: red; } input.invalid:-ms-input-placeholder{ color: red; } input.invalid::-webkit-input-placeholder { color: red; }
用这些伪类就可以让placeholder变色了,在用户需要显示红色的时候,用js给input加上invalid class就行了