input placeholder兼容ie10以下

代码如下：

if( /msie/.test(navigator.userAgent.toLowerCase()) && $.browser.version.slice(0,3) < 10) { $('input[placeholder]').each(function(){ var input = $(this); $(input).val(input.attr('placeholder')); $(input).focus(function(){ if (input.val() == input.attr('placeholder')) { input.val(''); } }); $(input).blur(function(){ if (input.val() == '' || input.val() == input.attr('placeholder')) { input.val(input.attr('placeholder')); } }); }); }

其中

$.brower.msie = /msie/.test(navigator.userAgent.toLowerCase()) //$.brower jquery1.90以上被去除Jquery 1.9.0 以上版本 扩展使用 $.browser 方法

由于jQuery 1.9.0 以上版本 jquery去掉了对 $.browser 的支持,采用$.support 来判断浏览器类型。导致之前的很多插件报错

"Uncaught TypeError: Cannot read property 'msie' of undefined".

 

网上有很多解决办法如：

判断浏览器类型：

 

[html]  view plain  copy   <span style="white-space:pre">    </span>$.browser.mozilla = /firefox/.test(navigator.userAgent.toLowerCase());      $.browser.webkit = /webkit/.test(navigator.userAgent.toLowerCase());      $.browser.opera = /opera/.test(navigator.userAgent.toLowerCase());      $.browser.msie = /msie/.test(navigator.userAgent.toLowerCase());   号后面的表达式返回的就是 true/false， 可以直接用来替换原来的 $.browser.msie 等。检查是否为 IE6：// Old [html]  view plain  copy   <span style="white-space:pre">    </span>if ($.browser.msie && 7 > $.browser.version) {}   // New [html]  view plain  copy   <span style="white-space:pre">    </span>if ('undefined' == typeof(document.body.style.maxHeight)) {}   检查是否为 IE 6-8： [html]  view plain  copy   <span style="white-space:pre">    </span>if (!$.support.leadingWhitespace) {}  

 

 

**************************************************************************

下面  我们采取的思路是 使用jquery的继承机制 对jquery 1.11.1版本 进行扩展 使其支持 $.browser 方法，已达到兼容之前组件的目的.

 

[html]  view plain  copy   jQuery.extend({      browser: function()       {          var          rwebkit = /(webkit)\/([\w.]+)/,          ropera = /(opera)(?:.*version)?[ \/]([\w.]+)/,          rmsie = /(msie) ([\w.]+)/,          rmozilla = /(mozilla)(?:.*? rv:([\w.]+))?/,              browser = {},          ua = window.navigator.userAgent,          browserMatch = uaMatch(ua);            if (browserMatch.browser) {              browser[browserMatch.browser] = true;              browser.version = browserMatch.version;          }          return { browser: browser };      },  });    function uaMatch(ua)   {          ua = ua.toLowerCase();            var match = rwebkit.exec(ua)                      || ropera.exec(ua)                      || rmsie.exec(ua)                      || ua.indexOf("compatible") < 0 && rmozilla.exec(ua)                      || [];            return {              browser : match[1] || "",              version : match[2] || "0"          };  }  

 

 

将以上代码 保存成 jquery-browser.js 使用即可。

转载于:https://www.cnblogs.com/hjsblogs/p/5552489.html

相关资源：input的placeholder属性兼容ie8