针对IE8以下不支持input-placeholder 属性

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要单独做处理。

猜你喜欢

转载自darepanhf.iteye.com/blog/2259626