JavaScript常用脚本汇总（一）

内容摘要

jquery限制文本框只能输入数字
jquery限制文本框只能输入数字,兼容IE、chrome、FF（表现效果不一样）,示例代码如下：
*@param {function}

*@execute 将事件处理程序压

文章正文

jquery限制文本框只能输入数字

jquery限制文本框只能输入数字,兼容IE、chrome、FF（表现效果不一样）,示例代码如下：

*@param    {function}
     *@execute 将事件处理程序压入事件队列,并绑定DOMContentLoaded
     *          如果DOM加载已经完成，则立即执行
     *@caller
     */
    function domReady(fn){
        if (isReady) {
            fn.call(window);
        }
        else{
            eventQueue.push(fn);
        };
        bindReady();
    };
    /*domReady事件绑定
     *
     *@param    null
     *@execute 现代浏览器通过addEvListener绑定DOMContentLoaded,包括ie9+
     ie6-8通过判断doScroll判断DOM是否加载完毕
     *@caller   domReady()
     */
    function bindReady(){
        if (isReady) return;
        if (isBind) return;
        isBind = true;
        if (window.addEventListener) {
            document.addEventListener('DOMContentLoaded',execFn,false);
        }
        else if (window.attachEvent) {
            doScroll();
        };
    };
    /*doScroll判断ie6-8的DOM是否加载完成
     *
     *@param    null
     *@execute doScroll判断DOM是否加载完成
     *@caller   bindReady()
     */
    function doScroll(){
        try{
            document.documentElement.doScroll('left');
        }
        catch(error){
            return setTimeout(doScroll,20);
        };
        execFn();
    };
    /*执行事件队列
     *
     *@param    null
     *@execute 循环执行队列中的事件处理程序
     *@caller   bindReady()
     */
    function execFn(){
        if (!isReady) {
            isReady = true;
            for (var i = 0; i < eventQueue.length; i++) {
                eventQueue[i].call(window);
            };
            eventQueue = [];
        };
    };
    //js文件1
    domReady(function(){
    });
    //js文件2
    domReady(function(){
    });
    //注意，如果是异步加载的js就不要绑定domReady方法，不然函数不会执行，
    //因为异步加载的js下载之前，DOMContentLoaded已经触发，addEventListener执行时已经监听不到了

用原生JS对AJAX做简单封装

首先，我们需要xhr对象。这对我们来说不难，封装成一个函数。

url:"test.jsp",
        data:"name=dipoo&info=good",
        dataType:"json",
        success:function(data){
            alert(data.name);
        }
    });

跨域请求之JSONP

http://stackoverflow.com/questions/3483919/script-onload-onerror-with-iefor-lazy-loading-problems
*    使用nextSibling，发现不能实现。
*    令人恶心的是，即使请求的资源文件不存在。它的readyState也会经历“loaded”状态。这样你就没法区分请求成功或失败。
*    怕它了，最后使用前后台一起协调的机制解决最后的这个难题。无论请求成功或失败都让其调用callback(true)。
*    此时已经将区别成功与失败的逻辑放到了callback中，如果后台没有返回jsonp则调用failure，否则调用success。
*
*
* 接口
* Sjax.load(url, {
*    data      // 请求参数 (键值对字符串或js对象)
*    success   // 请求成功回调函数
*    failure   // 请求失败回调函数
*    scope     // 回调函数执行上下文
*    timestamp // 是否加时间戳
* });
*
*/
Sjax =
function(win){
    var ie678 = !-[1,],
        opera = win.opera,
        doc = win.document,
        head = doc.getElementsByTagName('head')[0],
        timeout = 3000,
        done = false;
    function _serialize(obj){
        var a = [], key, val;
        for(key in obj){
            val = obj[key];
            if(val.constructor == Array){
                for(var i=0,len=val.length;i<len;i++){
                    a.push(key + '=' + encodeURIComponent(val[i]));
                }
            }else{
                a.push(key + '=' + encodeURIComponent(val));
            }
        }
        return a.join('&');
    }
    function request(url,opt){
        function fn(){}
        var opt = opt || {},
        data = opt.data,
        success = opt.success || fn,
        failure = opt.failure || fn,
        scope = opt.scope || win,
        timestamp = opt.timestamp;
        if(data && typeof data == 'object'){
            data = _serialize(data);
        }
        var script = doc.createElement('script');
        function callback(isSucc){
            if(isSucc){
                if(typeof jsonp != 'undefined'){// 赋值右边的jsonp必须是后台返回的，此变量为全局变量
                    done = true;
                    success.call(scope, jsonp);
                }else{
                    failure.call(scope);
                    //alert('warning: jsonp did not return.');
                }
            }else{
                failure.call(scope);
            }
            // Handle memory leak in IE
            script.onload = script.onerror = script.onreadystatechange = null;
            jsonp = undefined;
            if( head && script.parentNode ){
                head.removeChild(script);
            }
        }
        function fixOnerror(){
            setTimeout(function(){
                if(!done){
                    callback();
                }
            }, timeout);
        }
        if(ie678){
            script.onreadystatechange = function(){
                var readyState = this.readyState;
                if(!done && (readyState == 'loaded' || readyState == 'complete')){
                    callback(true);
                }
            }
            //fixOnerror();
        }else{
            script.onload = function(){
                callback(true);
            }
            script.onerror = function(){
                callback();
            }
            if(opera){
                fixOnerror();
            }
        }
        if(data){
            url += '?' + data;
        }
        if(timestamp){
            if(data){
                url += '&ts=';
            }else{
                url += '?ts='
            }
            url += (new Date).getTime();
        }
        script.src = url;
        head.insertBefore(script, head.firstChild);
    }
    return {load:request};
}(this);

调用方式如下：

复制代码代码如下:

 Sjax.load('jsonp66.js', {

        success : function(){alert(jsonp.name)},

        failure : function(){alert('error');}

  });

千分位格式化

复制代码代码如下:

function toThousands(num) {

    var num = (num || 0).toString(), result = '';

    while (num.length > 3) {

        result = ',' + num.slice(-3) + result;

        num = num.slice(0, num.length - 3);

    }

    if (num) { result = num + result; }

    return result;

}

以上就是本文给大家分享的javascript常用脚本了，希望大家能够喜欢。

代码注释

上一篇 JQuery动画animate的stop方法使用详解下一篇 Win10安装程序无法正常启动怎么办？Win10安装程序无法正常启动解决办法

作者：喵哥笔记

学的不仅是技术，更是梦想！