IE8兼容textarea的placeholder属性

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

下面做如下处理：

 

1. $(function(){

2. if( !('placeholder' in document.createElement('input')) ){

3. $('input[placeholder],textarea[placeholder]').each(function(){

4. var that = $(this),

5. text= that.attr('placeholder');

6. if(that.val()===""){

7. that.val(text).addClass('placeholder');

8. }

9. that.focus(function(){

10. if(that.val()===text){

11. that.val("").removeClass('placeholder');

12. }

13. })

14. .blur(function(){

15. if(that.val()===""){

16. that.val(text).addClass('placeholder');

17. }

18. })

19. .closest('form').submit(function(){

20. if(that.val() === text){

21. that.val('');

22. }

23. });

24. });

25. }

26. });

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

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

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

 

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

 

1. .placeholder{

2. opacity:0.5;

3. filter:alpha(opacity=50);

4. }

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

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

 

转载地址：https://blog.csdn.net/mafan121/article/details/47779411