IE8兼容placeholder

来源：互联网发布：如何删除mac上的照片编辑：程序博客网时间：2024/05/01 18:50

placeholder属性树html5提出的新属性，作用是为input框或textarea框添加初始提示内容。当控件获取焦点输入时，清空提示内容。但IE8及其以下的版本并不支持该属性的显示。

下面做如下处理：

$(function(){ if( !('placeholder' in document.createElement('input')) ){       $('input[placeholder],textarea[placeholder]').each(function(){          var that = $(this),          text= that.attr('placeholder');          if(that.val()===""){            that.val(text).addClass('placeholder');          }          that.focus(function(){            if(that.val()===text){              that.val("").removeClass('placeholder');            }          })          .blur(function(){            if(that.val()===""){              that.val(text).addClass('placeholder');            }          })          .closest('form').submit(function(){            if(that.val() === text){              that.val('');            }          });        });   }});

第一个if条件是判断placeholder是否存在于解析的input框中。

closest方法的作用是:从当前元素开始向上查找，直到找到匹配的元素为止。

上诉closest方式计算查找form元素，然后在执行提交的form表单的时候执行sumit的方法。

上面添加了一个palceholder样式，其样式内容为：

.placeholder{opacity:0.5;filter:alpha(opacity=50);}

opcaity属性是用来定义透明度的，其值在0-1.0之间。但IE8及其以下的版本并不支持。

在IE8上需用filter:alpha(opacity=?)来过滤，opacity的值在0-100间。

0 0