JavaScript 项目实战工具类

自己封装的一些项目工具类，留着以后难免会用到！

1、通过参数名获取URL传递的参数值

方法一

GetQueryString:function(name){//通过参数名获取URL传递的参数值
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
        if (r != null)
            return (r[2]);
        return null;
}

方法二

GetRequest:function(){//通过参数名获取URL传递的参数值(js获取url传递参数)
    var url = location.search || location.href; //获取url中"?"符后的字串
    var theRequest = new Object();
    if (url.indexOf("?") != -1) {
        var str = url.substr(1);
        strs = str.split("&");
        for(var i = 0; i < strs.length; i ++) {
          theRequest[strs[i].split("=")[0]]=(strs[i].split("=")[1]);
        }
   }
   return theRequest;
}

2、重点内容生成6位数的单号

generateMixed:function(){//生成6位数的单号
        var Num = "";
        for (var i = 0; i < 6; i++) {
            Num += Math.floor(Math.random() * 10);
        }
        return Num;
    }

3、日期时间

showDate:function(){
        var date = new Date();
        var year = date.getFullYear();
        var month = date.getMonth() + 1;
        var day = date.getDate();
        var hour = date.getHours();
        var minute = date.getMinutes();
        var second = date.getSeconds();
        if (minute < 10) {
            minute = "0" + minute;
        }

        if (second < 10) {
            second = "0" + second;
        }
        return year + '-' + month + '-' + day + ' ' + hour + ':' + minute;
    }

4、判断是哪个终端

versions:function(){//判断是哪个终端
        var u = window.navigator.userAgent;
        return {
            trident: u.indexOf('Trident') > -1, //IE内核
            presto: u.indexOf('Presto') > -1, //opera内核
            webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
            gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
            mobile: !!u.match(/AppleWebKit.*Mobile.*/) || !!u.match(/AppleWebKit/), //是否为移动终端
            ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
            android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或者uc浏览器
            iPhone: u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1, //是否为iPhone或者安卓QQ浏览器
            iPad: u.indexOf('iPad') > -1, //是否为iPad
            webApp: u.indexOf('Safari') == -1, //是否为web应用程序，没有头部与底部
            weixin: u.indexOf('MicroMessenger') == -1 //是否为微信浏览器
        };
    }()

5、判断客户端是否为 PC 还是手持设备 true为pc,false为手持设备

IsPC:function(){//判断客户端是否为 PC 还是手持设备 true为pc,false为手持设备
        var userAgentInfo = navigator.userAgent;
        var Agents = ["Android", "iPhone",
                    "SymbianOS", "Windows Phone",
                    "iPad", "iPod"];
        var flag = true;
        for (var v = 0; v < Agents.length; v++) {
            if (userAgentInfo.indexOf(Agents[v]) >= 0) {
                flag = false;
                break;
            }
        }
        //如果是PC浏览器的话，显示移动端打开，
        if(flag){
            $("body").empty().append("<div style='text-align: center;position:absolute;top:30%;left:0;bottom:0;right:0;font-size:2rem'>请使用手持设备访问<div>");
        }
        return flag;
    }

6、窗口响应事件

responseWin:function(){//窗口响应事件
        return function(){
            /*window.onresize = function(){
                return common.IsPC();
            };*/
            return common.IsPC();
        }();
    }

7、get/post设置参数，同步异步请求。

postAjax(type,path,params,dataType,async){//设置参数，同步异步请求。
        var datas = "";
        $.ajax({ 
            type : type?type:"post", 
            url : path, 
            data : params, 
            dataType: dataType?dataType:"json",
            async : async?async:false, 
            success : function(data){ 
                datas = data;
            }
        });
        return datas;
    }

8、localStorage

var v = localStorage.getItem('n') ? localStorage.getItem('n') : "";  
// 如果名称是 n 的数据存在 ，则将其读出 ，赋予变量v 。 

localStorage.setItem('n', v);                                           
// 写入名称为 n、值为 v 的数据 

localStorage.removeItem('n');                                           
// 删除名称为 n 的数据 

9、判断是否为iPhone

// 判断是否为 iPhone ： 

function isAppleMobile() { 

    return (navigator.platform.indexOf('iPad') != -1); 

}; 

10、双手指滑动事件

// 双手指滑动事件

addEventListener('load',function(){
 window.onmousewheel = twoFingerScroll;
}, false); // false-->兼容各浏览器，表示在冒泡阶段调用事件处理程序 (true 捕获阶段)


function twoFingerScroll(ev) { 
    var delta =ev.wheelDelta/120;              
    //对 delta 值进行判断(比如正负) ，而后执行相应操作 
    return true; 
}; 

11、隐藏地址栏 并且 处理事件的时候，防止滚动条出现

// 隐藏地址栏 & 处理事件的时候 ，防止滚动条出现

addEventListener('load', function(){ 
   setTimeout(function(){ window.scrollTo(0, 1); }, 100); 
});

12、屏幕旋转事件（onorientationchange）

//添加屏幕旋转事件侦听，可随时发现屏幕旋转状态（左旋、右旋还是没旋）。

// 判断屏幕是否旋转

function orientationChange() { 
    switch(window.orientation) { 
    　　case 0:  
            alert("肖像模式 0,screen-width: " + screen.width + "; screen-height:" + screen.height); 
            break; 
    　　case -90:  
            alert("左旋 -90,screen-width: " + screen.width + "; screen-height:" + screen.height); 
            break; 
    　　case 90:    
            alert("右旋 90,screen-width: " + screen.width + "; screen-height:" + screen.height); 
            break; 
    　　case 180:    
        　　alert("风景模式 180,screen-width: " + screen.width + "; screen-height:" + screen.height); 
        　　break; 
    };<br>};


// 添加事件监听 
addEventListener('load', function(){ 
    orientationChange(); 
    window.onorientationchange = orientationChange; 

});

13、移动事件收集

// 手势事件

touchstart            //当手指接触屏幕时触发

touchmove           //当已经接触屏幕的手指开始移动后触发

touchend             //当手指离开屏幕时触发

touchcancel



// 触摸事件

gesturestart          //当两个手指接触屏幕时触发

gesturechange      //当两个手指接触屏幕后开始移动时触发

gestureend



// 屏幕旋转事件 

onorientationchange     



// 检测触摸屏幕的手指何时改变方向 

orientationchange       



// touch事件支持的相关属性

touches         

targetTouches       

changedTouches              

clientX　　　　// X coordinate of touch relative to the viewport (excludes scroll offset) 

clientY　　　　// Y coordinate of touch relative to the viewport (excludes scroll offset) 

screenX　　　 // Relative to the screen 

screenY 　　  // Relative to the screen 

pageX　　 　　// Relative to the full page (includes scrolling) 

pageY　　　　 // Relative to the full page (includes scrolling) 

target　　　　 // Node the touch event originated from 

identifier　　   // An identifying number, unique to each touch event

14、特殊链接（电话、发短信）

     如果你关闭自动识别后 ，又希望某些电话号码能够链接到 iPhone 的拨号功能 ，那么可以通过这样来声明电话链接 ,

<a href="tel:12345654321">打电话给我</a>

<a href="sms:12345654321">发短信</a>

或用于单元格：

<td onclick="location.href='tel:122'">

15、自动大写与自动修正

     要关闭这两项功能，可以通过autocapitalize 与autocorrect 这两个选项：

<input type="text" autocapitalize="off" autocorrect="off" />

16、浏览器链接跳转。

window.location.href = "xx.html";

或者

window.open();

17、更改浏览器链接“ 不 ”跳转。

（a）history.pushState

history.pushState({}, "页面标题", "xxx.html");

（b）history.pushStatehistory.replaceState

history.replaceState(null, "页面标题", "xxx.html");

（c）window.onpopstate

window.addEventListener("popstate", function() {
    var currentState = history.state;
    /* * 代码块 */                                          
});

18、链接 获取 http:// 或者 https:// 的请求头 。

 var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
//获取请求头的http

document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3F382f81c966395258f239157654081890' type='text/javascript'%3E%3C/script%3E"));

19、Js 流量测速 。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

    <head>
        <title> Document </title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta name="Generator" content="EditPlus">
    </head>

    <body>
        <SCRIPT language=JavaScript> var st = new Date(); </SCRIPT>
        <IMG alt="测试图片" src="http://sp2.yokacdn.com/photos/f3/4f/702018/photo_322092_500.jpg" onload="showspeed();">
        <div id='showtxt'></div>
        <script> var arr = ["网速低于50KB", "网速在50-100KB之间", "网速在100-200KB之间", "网速在200-300KB之间", "视频通讯"]; function showspeed() { var filesize = 35.4; //measured in KB  var et = new Date(); var speed = Math.round(filesize * 1000) / (et - st); document.title = speed; var scope = (speed > 0 && speed <= 50) ? 0 : (speed > 50 && speed <= 100) ? 1 : (speed >= 100 && speed < 200) ? 2 : (speed >= 200 && speed < 300) ? 3 : 4; alert(scope) console.log("您的下载速度为：" + arr[scope] + " (K/秒)"); } </script>
    </body>

</html>