让IE支持placeholder属性~

本文主要是介绍让IE支持placeholder属性~，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

1. [代码][JavaScript]代码

 ? 
 /* 
   * jQuery placeholder, fix for IE6,7,8,9 
   * @author JENA 
   * @since 20131115.1504 
   * @website ishere.cn 
   */ 
 var  JPlaceHolder = { 
      //检测 
      _check :  function (){ 
          return  'placeholder'  in  document.createElement( 'input' ); 
      }, 
      //初始化 
      init :  function (){ 
          if (! this ._check()){ 
              this .fix(); 
          } 
      }, 
      //修复 
      fix :  function (){ 
          jQuery( ':input[placeholder]' ).each( function (index, element) { 
              var  self = $( this ), txt = self.attr( 'placeholder' ); 
              self.wrap($( '<div></div>' ).css({position: 'relative' , zoom: '1' , border: 'none' , background: 'none' , padding: 'none' , margin: 'none' })); 
              var  pos = self.position(), h = self.outerHeight( true ), paddingleft = self.css( 'padding-left' ); 
              var  holder = $( '<span></span>' ).text(txt).css({position: 'absolute' , left:pos.left, top:pos.top, height:h, lienHeight:h, paddingLeft:paddingleft, color: '#aaa' }).appendTo(self.parent()); 
              self.focusin( function (e) { 
                  holder.hide(); 
              }).focusout( function (e) { 
                  if (!self.val()){ 
                      holder.show(); 
                  } 
              }); 
              holder.click( function (e) { 
                  holder.hide(); 
                  self.focus(); 
              }); 
          }); 
      } 
 }; 
 //执行 
 jQuery( function (){ 
      JPlaceHolder.init();     
 }); 

2. [代码]使用方法跳至 [1] [2] [全屏预览]

 ? 
 <! doctype  html> 
 < html > 
 < head > 
 < meta  charset = "utf-8" > 
 < title >jQuery JPlaceholder Demo</ title > 
 < script  src = "jquery-1.8.3.min.js" ></ script > 
 < script  src = "jquery.JPlaceholder.js" ></ script > 
 </ head > 
 < body > 
 < form > 
 < div > 
    < ul > 
      < li > 
        < input  type = "text"  name = "username"  placeholder = "用户名" > 
      </ li > 
      < li > 
        < input  type = "password"  name = "username"  placeholder = "密码" > 
      </ li > 
      < li > 
        < button  type = "button" >登录</ button > 
      </ li > 
    </ ul > 
 </ div > 
 </ form > 
 </ body > 
 </ html > 