zoukankan      html  css  js  c++  java
  • 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
     
    1. <span style="white-space:pre">    </span>$.browser.mozilla = /firefox/.test(navigator.userAgent.toLowerCase());  
    2.     $.browser.webkit = /webkit/.test(navigator.userAgent.toLowerCase());  
    3.     $.browser.opera = /opera/.test(navigator.userAgent.toLowerCase());  
    4.     $.browser.msie = /msie/.test(navigator.userAgent.toLowerCase());  


    号后面的表达式返回的就是 true/false, 可以直接用来替换原来的 $.browser.msie 等。


    检查是否为 IE6:
    // Old
    [html] view plain copy
     
    1. <span style="white-space:pre">    </span>if ($.browser.msie && 7 > $.browser.version) {}  
     // New
    [html] view plain copy
     
    1. <span style="white-space:pre">    </span>if ('undefined' == typeof(document.body.style.maxHeight)) {}  
     检查是否为 IE 6-8:
    [html] view plain copy
     
    1. <span style="white-space:pre">    </span>if (!$.support.leadingWhitespace) {}  
    
    
    
    

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

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

    [html] view plain copy
     
    1. jQuery.extend({  
    2.     browser: function()   
    3.     {  
    4.         var  
    5.         rwebkit = /(webkit)/([w.]+)/,  
    6.         ropera = /(opera)(?:.*version)?[ /]([w.]+)/,  
    7.         rmsie = /(msie) ([w.]+)/,  
    8.         rmozilla = /(mozilla)(?:.*? rv:([w.]+))?/,      
    9.         browser = {},  
    10.         ua = window.navigator.userAgent,  
    11.         browserMatch = uaMatch(ua);  
    12.   
    13.         if (browserMatch.browser) {  
    14.             browser[browserMatch.browser] = true;  
    15.             browser.version = browserMatch.version;  
    16.         }  
    17.         return { browser: browser };  
    18.     },  
    19. });  
    20.   
    21. function uaMatch(ua)   
    22. {  
    23.         ua = ua.toLowerCase();  
    24.   
    25.         var match = rwebkit.exec(ua)  
    26.                     || ropera.exec(ua)  
    27.                     || rmsie.exec(ua)  
    28.                     || ua.indexOf("compatible") 0 && rmozilla.exec(ua)  
    29.                     || [];  
    30.   
    31.         return {  
    32.             browser : match[1] || "",  
    33.             version : match[2] || "0"  
    34.         };  
    35. }  
    将以上代码 保存成 jquery-browser.js 使用即可。
  • 相关阅读:
    错误与异常_2-11选择题
    错误与异常_2-10选择题
    错误与异常_2-8选择题
    错误与异常_2-7选择题
    C#定时器
    C#动态webservice调用接口
    C# webservice返回Xml格式文件
    C#创建简单的Xml文件
    获取数据库中指定类型的数据库名称
    C#生成Xml以UTF-8无BOM格式编码
  • 原文地址:https://www.cnblogs.com/hjsblogs/p/5552489.html
Copyright © 2011-2022 走看看