CSS3新属性placeholder给表单带来了方便,但是IE8以下并不支持,增加一段JQ代码使得IE8以下浏览器能够像其他浏览器一样,获取placeholder的值,赋给val。
//input placeholder jQuery('[placeholder]').focus(function() { var input = jQuery(this); if (input.val() == input.attr('placeholder')) { input.val(''); input.removeClass('placeholder'); } input.css("color","#555"); }).blur(function() { var input = jQuery(this); if (input.val() == '' || input.val() == input.attr('placeholder')) { input.addClass('placeholder'); input.val(input.attr('placeholder')); input.css("color","#888"); } }).blur().parents('form').submit(function() { jQuery(this).find('[placeholder]').each(function() { var input = jQuery(this); if (input.val() == input.attr('placeholder')) { input.val(''); } }) });
这里可以单独写在一个js文件中,需要用到的地方调用:
<!--[if lte IE 8]> <script type="text/javascript" src="js/IE8.js"></script> <![endif]-->
我加了下颜色变化,使得在IE8下跟其他浏览器基本一样,另外关于password要单独做处理。