js 一些小技巧 2-CSDN博客

ajs 的一些小技巧

(1)传入一个表单控件(如input输入框,按钮)获取所在的form

     Js代码   
     
   
var getForm= function (formElement) {  
           var $that=$(formElement).parent();  
           var max=6;//limit the depth  
           var fieldsetElement=null;//form element  
           var tagName=null;//html tag name  
           while((fieldsetElement=$that.get(0))&&fieldsetElement.tagName!==undefined&&(tagName=fieldsetElement.tagName.toLowerCase())!=='form'&&max>0){  
               if(tagName==='fieldset'){//html5 new tag  
                   $that=$(fieldsetElement.form);  
                   break;  
               }  
               $that=$that.parent();  
               max--;  
           }  
           console.log(max);  
           return $that;  
       };  

完整示例:

     Html代码   
     
   
<!DOCTYPE html>  
<html>  
<head lang="en">  
    <meta charset="UTF-8">  
    <script type="text/javascript" src="js/jquery-1.11.1.js"></script>  
    <title></title>  
    <script type="text/javascript">  
        var getForm = function (formElement) {  
            var $that = $(formElement).parent();  
            var max = 6;//limit the depth  
            var fieldsetElement = null;//form element  
            var tagName = null;//html tag name  
            while ((fieldsetElement = $that.get(0)) && fieldsetElement.tagName !== undefined && (tagName = fieldsetElement.tagName.toLowerCase()) !== 'form' && max > 0) {  
                if (tagName === 'fieldset') {//html5 new tag  
                    $that = $(fieldsetElement.form);  
                    break;  
                }  
                $that = $that.parent();  
                max--;  
            }  
            console.log(max);  
            return $that;  
        };  
        var getForm22 = function (self) {  
            $form = getForm(self);  
            console.log($form);  
        }  
  
    </script>  
</head>  
<body>  
<div id="login-content">  
    <form id="myForm">  
        <div>  
            <div>  
                <div class="inputs">  
                    <input id="username" type="text" name="username" placeholder="用户名"  
  
                           required>  
                    <input id="password" type="password" name="password" placeholder="密码"  
                           required>  
                </div>  
                <div>  
                    <input type="button" id="submit" onclick="getForm22(this)"  
                           value="登录">  
                   
                </div>  
            </div>  
        </div>  
    </form>  
</div>  
</body>  
</html>  

注意:参数是普通的html元素,返回的是jQuery对象

(2)js把毫秒转化为时间

     Js代码   
     
var releaseDate=new Date(Number(obj.releaseTime)*1000).format('MM-dd  HH:mm');//把毫秒数转化为日期

注意:上述代码中obj.releaseTime的单位是秒(不是毫秒)

(3)把数组拼接为字符串:使用join

     Js代码   
     
   
var html = [];  
       if(data.length2>0){  
           var recordList=data.recordList;  
           for(var i=0;i<data.length2;i++){  
               html.push(getBBSCommentListItem(recordList[i]));  
           }  
           $livespanel_ul.append(html.join(''));  
       }  

(4)web app中使用jsonp跨域请求时如何带上sessionid

跨域访问

在url地址最后面加上;jsessionid=<你的实际sessionid>

实例

     Js代码   
     
   
var modi_url='http://'+server_url+'/user/mod_pass?callback=?&password='+old_password_val+"&password2="+new_password_val+";jsessionid="+window.sessionId;  
    console.log&&console.log(modi_url);  
    $.jsonP({url:modi_url,success:function(data){  
        var result=data.result;  
        hideMask2();  
        switch (result)  
        {  
            case 1:  
                user.password=new_password_val;  
                alert("修改成功");  
                $.ui.goBack();  
                break;  
            case 23:  
                alert("新密码不能为空");  
                break;  
            case 21:  
                alert("请先登录");  
                $.ui.goBack();  
                break;  
            case 22:  
                alert("两次密码不能相同");  
                break;  
            case 24:  
                alert("密码已过期,请点击右上角的刷新按钮");  
                break;  
        }  
  
    }});  

(5)创建数组

var html = [];

(6)判断对象是否包含指定属性

'length' in objArr 可以判断objArr 是否包含length属性

示例:

     Js代码   
     
   
if (!('length' in objArr)) {// just only single component (not array).  
        objArr.style.display = "block";  
    }else{  
    for ( var i = 0; i < objArr.length; i++) {  
        var objOne = objArr[i];  
        objOne.style.display = "block";  
    }  
    }  

(7)获取浏览器类型

jquery-1.11.1.js中没有了获取浏览器的方法,可以添加如下代码

     Js代码   
     
   
/*** 
 * get browser type 
 * @param jQuery 
 */  
var checkBrowser = function (jQuery) {  
  
    if (jQuery.browser) return;  
  
    jQuery.browser = {};  
    jQuery.browser.mozilla = false;  
    jQuery.browser.webkit = false;  
    jQuery.browser.opera = false;  
    jQuery.browser.msie = false;  
  
    var nAgt = navigator.userAgent;  
    jQuery.browser.name = navigator.appName;  
    jQuery.browser.fullVersion = '' + parseFloat(navigator.appVersion);  
    jQuery.browser.majorVersion = parseInt(navigator.appVersion, 10);  
    var nameOffset, verOffset, ix;  
  
// In Opera, the true version is after "Opera" or after "Version"  
    if ((verOffset = nAgt.indexOf("Opera")) != -1) {  
        jQuery.browser.opera = true;  
        jQuery.browser.name = "Opera";  
        jQuery.browser.fullVersion = nAgt.substring(verOffset + 6);  
        if ((verOffset = nAgt.indexOf("Version")) != -1)  
            jQuery.browser.fullVersion = nAgt.substring(verOffset + 8);  
    }  
// In MSIE, the true version is after "MSIE" in userAgent  
    else if ((verOffset = nAgt.indexOf("MSIE")) != -1) {  
        jQuery.browser.msie = true;  
        jQuery.browser.name = "Microsoft Internet Explorer";  
        jQuery.browser.fullVersion = nAgt.substring(verOffset + 5);  
    }  
// In Chrome, the true version is after "Chrome"  
    else if ((verOffset = nAgt.indexOf("Chrome")) != -1) {  
        jQuery.browser.webkit = true;  
        jQuery.browser.name = "Chrome";  
        jQuery.browser.fullVersion = nAgt.substring(verOffset + 7);  
    }  
// In Safari, the true version is after "Safari" or after "Version"  
    else if ((verOffset = nAgt.indexOf("Safari")) != -1) {  
        jQuery.browser.webkit = true;  
        jQuery.browser.name = "Safari";  
        jQuery.browser.fullVersion = nAgt.substring(verOffset + 7);  
        if ((verOffset = nAgt.indexOf("Version")) != -1)  
            jQuery.browser.fullVersion = nAgt.substring(verOffset + 8);  
    }  
// In Firefox, the true version is after "Firefox"  
    else if ((verOffset = nAgt.indexOf("Firefox")) != -1) {  
        jQuery.browser.mozilla = true;  
        jQuery.browser.name = "Firefox";  
        jQuery.browser.fullVersion = nAgt.substring(verOffset + 8);  
    }  
// In most other browsers, "name/version" is at the end of userAgent  
    else if ((nameOffset = nAgt.lastIndexOf(' ') + 1) <  
        (verOffset = nAgt.lastIndexOf('/'))) {  
        jQuery.browser.name = nAgt.substring(nameOffset, verOffset);  
        jQuery.browser.fullVersion = nAgt.substring(verOffset + 1);  
        if (jQuery.browser.name.toLowerCase() == jQuery.browser.name.toUpperCase()) {  
            jQuery.browser.name = navigator.appName;  
        }  
    }  
// trim the fullVersion string at semicolon/space if present  
    if ((ix = jQuery.browser.fullVersion.indexOf(";")) != -1)  
        jQuery.browser.fullVersion = jQuery.browser.fullVersion.substring(0, ix);  
    if ((ix = jQuery.browser.fullVersion.indexOf(" ")) != -1)  
        jQuery.browser.fullVersion = jQuery.browser.fullVersion.substring(0, ix);  
  
    jQuery.browser.majorVersion = parseInt('' + jQuery.browser.fullVersion, 10);  
    if (isNaN(jQuery.browser.majorVersion)) {  
        jQuery.browser.fullVersion = '' + parseFloat(navigator.appVersion);  
        jQuery.browser.majorVersion = parseInt(navigator.appVersion, 10);  
    }  
    jQuery.browser.version = jQuery.browser.majorVersion;  
};  
checkBrowser(jQuery);  

以上用于jquery.

下面的不是用于jquery的 :

     Js代码   
     
   
/*** 
 * get browser type and browser version and language 
 when page open,the function will be executed automaticly 
 * @param write22 
 * @returns {{systemLanguage,userLanguage,ver}} 
 */  
com.whuang.hsj.getBrowserVersion=(function(write22){  
    var browser = {};  
//    console.dir(navigator);  
    var userAgent = navigator.userAgent.toLowerCase();  
    /*for(osvId in navigator){ 
        var value222=navigator[osvId]; 
        document.writeln(osvId+":&nbsp;"+value222+'<br>'); 
    }*/  
    var lang22=navigator.language;  
//    document.writeln(userAgent+'<br>');  
//    document.writeln(navigator.appCodeName+'<br>');  
    var s;  
    (s = userAgent.match(/msie ([\d.]+)/)) ? browser.ie = s[1] : (s = userAgent.match(/firefox\/([\d.]+)/)) ? browser.firefox = s[1] : (s = userAgent.match(/chrome\/([\d.]+)/)) ? browser.chrome = s[1] :  
        (s = userAgent.match(/opera.([\d.]+)/)) ? browser.opera = s[1] : (s = userAgent.match(/version\/([\d.]+).*safari/)) ? browser.safari = s[1] : 0;  
    var version = "";  
    if (browser.ie) {  
        version =  browser.ie;  
        if(write22 && write22!=false && write22!='false'){  
            document.writeln('IE<br>');  
        }  
        if(!browser.lang ||browser.lang==undefined){  
            lang22=navigator.browserLanguage;  
            browser.systemLanguage=navigator.systemLanguage ;  
            browser.userLanguage=navigator.userLanguage;  
        }  
    }  
    else  
    if (browser.firefox) {  
        version = browser.firefox;  
        browser.mozilla=browser.firefox;  
        if(write22 && write22!=false && write22!='false'){  
            document.writeln('firefox<br>');  
        }  
    }  
    else  
    if (browser.chrome) {  
        version = browser.chrome;  
        if(write22 && write22!=false && write22!='false'){  
            document.writeln('chrome<br>');  
        }  
    }  
    else  
    if (browser.opera) {  
        version =  browser.opera;  
        if(write22 && write22!=false && write22!='false'){  
            document.writeln('opera<br>');  
        }  
    }  
    else  
    if (browser.safari) {  
        version =  browser.safari;  
        if(write22 && write22!=false && write22!='false'){  
            document.writeln('Safari<br>');  
        }  
    }  
    else {  
        version = 'unknown browser';  
    }  
    browser.ver=version;  
    if(lang22 && lang22!=undefined)  
    {  
        browser.lang=lang22.toLowerCase();  
    }  
    return browser;  
})();  

使用方法:

     Js代码   
     
   
var brow ;  
        if(com.whuang.hsj.getBrowserVersion){  
            brow =com.whuang.hsj.getBrowserVersion;  
        }  
        if(type22=='mid'||type22=='middle'){  
            $("#loadPanel").css("background-image", "url(\"../static/images/loading/loading_middle.gif\")");  
            if(brow&&brow.chrome){//因为在chrome 中有时背景图片gif不显示  
                $("#loading_gif").css("display","block");  
            $("#loading_gif").attr("src", "../static/images/loading/loading_middle.gif");     
            }  
              
        }else if(type22=='small'||type22=='little'){  
            $("#loadPanel").css("background-image", "url(\"../static/images/loading/loading_small.gif\")");  
            if(brow&&brow.chrome){//因为在chrome 中有时背景图片gif不显示  
                $("#loading_gif").css("display","block");  
            $("#loading_gif").attr("src", "../static/images/loading/loading_small.gif");  
        }  
        }else{  
            $("#loadPanel").css("background-image", "url(\""+type22+"\")");  
        }  

(8)通过name属性获取单个元素

     Js代码   
     
   
/*** 
 * if is radio ,please use com.whuang.hsj.$$arr 
 * @param name22 
 * @returns 
 */  
com.whuang.hsj.$$one = function(name22) {  
    if (com.whuang.hsj.isHasValue(name22)) {  
        var names222=document.getElementsByName(name22);  
        //alert("names222:"+names222);  
        //alert("typeof:"+(typeof names222 ));  
        var className=Object.prototype.toString.call(names222);  
        var boolean_isArray;  
        var ieHtmlCollection='[object HTMLCollection]';  
        if(isIEtest)//if browser is IE  
        {  
                 boolean_isArray=( className=== '[object Object]') ||(className=== ieHtmlCollection) ||names222 instanceof Array ;  
        }else  
        {  
                 boolean_isArray=( className=== '[object Array]') ||(className=== '[object NodeList]'  )||(className==ieHtmlCollection)||names222 instanceof Array||names222 instanceof NodeList;  
        }  
        if(names222){  
             if(boolean_isArray){  
                     return names222[0];  
             }else{  
                     return names222;  
            }  
        }else{  
            return "";  
        }  
    } else {  
        return "";  
    }  
};  

使用场景:

html代码:

     Html代码   
     
   
<input id="username" type="text" name="username" placeholder="用户名"  
                           required>  

js代码

     Js代码   
     
   
var username=com.whuang.hsj.$$one("username");  
       alert(username.value);  

(9)字符串source 中是否包含key2

     Js代码   
     
   
com.whuang.hsj.contains=function(source,key2){  
    var isDownload=(source.indexOf(key2)>-1);  
    if(isDownload){  
        return true;  
    }else{  
        return false;  
    }  
}  

(10)判断以指定字符串开头或结尾

     Js代码   
     
   
com.whuang.hsj.startWith=function(str,regex){  
    if(regex==undefined||str==undefined){  
        return false;  
    }  
    return str.indexOf(regex)==0;  
};  
com.whuang.hsj.endWith=function(str,regex){  
    return str.lastIndexOf(regex)==str.length-regex.length;  
};  