input 的 placeholder属性在IE8下的兼容处理

placeholder是input标签的新属性，在使用的时候有两个问题：

1、IE8 下不兼容

处理思路：

如果浏览器不识别placeholder属性，给input添加类名placeholder，模仿placeholder属性的样式，并给input 的value赋值placeholder属性的值

2、 input的type属性是password的情况，用上面的方法处理提示语为密码文

处理思路：

新添加一个标签，模仿placeholder属性

直接上代码：

css部分：

  .input-item {
       position: relative;
       margin: 10px;
     }
 .pwd-place {
   position: absolute;
   top:;
   left: 72px;
   width: 100%;
   height: 100%;
   font-size: 12px;
 }

html部分：

  <form action="#">
   <div class="input-item">
     <label for="userName">用户名：</label>
     <input class="username" id="userName" type="text" placeholder="请输入用户名">
   </div>
    <div class="input-item">
     <label for="pwd">密码：</label>
     <input class=" password" id="pwd" type="password" placeholder="请输入密码">
     <span class="pwd-place"></span>
   </div>

   </form>

js部分：

 <script src="jquery-1.11.3.js"></script>
   <script>
       function placeholder(el){

          function isPlaceholer(){
           var input = document.createElement("input");
           return "placeholder" in input;
          }

         var $el = $(el);
         if( isPlaceholer()==false && !('placeholder' in document.createElement('input')) ){

               $('input[placeholder],textarea[placeholder]').each(function(){
                   var that = $(this),
                           text= that.attr('placeholder');
                   if(that.val()===""){
                       if(that.attr("type") == "password"){
                           $el.html("请输入密码");
                       }else {
                           that.val(text).addClass('placeholder');
                       }
                   }
                   that.focus(function(){
                       if($el.html() == text){
                           $el.html("");
                       }
                       if(that.val()===text) {
                           that.val("").removeClass('placeholder');

                       }
                   })
                   .blur(function(){
                       if(that.val()==="") {
                           if (that.attr("type") == "password") {
                               $el.html("请输入密码");

                           }else {
                               that.val(text).addClass('placeholder');
                           }
                       }
                   })
                   .closest('form').submit(function(){
                       if(that.val() === text){
                           that.val('');
                       }
                   });
               });
            }
       }
  $(document).ready(function() {
      placeholder(".pwd-place")
       });
   </script>