placeholder兼容各浏览器

 1 var funPlacegholder = function(element){
 2     //检测浏览器是否支持placeholder
 3     var placeholder = '';
 4     if(element && !('placeholder' in document.createElement('input')) && (placeholder = element.getAttribute('placeholder'))) {
 5         //当前控件是否有id，没有则创建
//个人感觉这里不需判断id

 6         var idLabel = element.id;
 7         if(idLabel){
 8             idLabel = 'placeholder' + new Date().getTime();
 9             element.id = idLabel;
10         }
11         
12         //创建label元素
13         var eleLabel = document.createElement("label");
14         eleLabel.htmlFor = idLabel;
15         eleLabel.style.position = "absolute";
16         eleLabel.style.color = 'graytext';
17         eleLabel.style.cursor = "text";
18         //插入创建的label元素节点
19         element.parentNode.insertBefore(eleLabel,element);
20         //事件
21         element.onfocus = function(){
22             eleLabel.innerHTML = '';
23         };
24         
25         element.onblur = function(){
26             if(this.value === ""){
27                eleLabel.innerHTML = placeholder;
28             }
29         };
30         
31         //样式初始化
32         if(element.value === ""){
33             eleLabel.innerHTML = placeholder;
34         }
35     }
36 };

 

参考：张鑫旭：HTML5 placeholder实际应用经验分享及拓展

转载于:https://www.cnblogs.com/onehalftree/archive/2013/04/01/2993787.html