使用Jquery promise 动态引入js文件

动态加载一个js得方式很多,如下方式:

/**
*一般方式加载
*/
function normalLoadScript(url) {
            var node = document.createElement('script');
            node.type = "text/javascript";
            node.src = url;
            document.getElementsByTagName('head')[0].appendChild(node);
        }
cnblog_mc

那么如果需要在这个js加载完成之后执行一些逻辑,该怎么做呢?可以使用jquery 提供的promise对象进行改造此方法

function promiseLoadScript (url) {
            var dtd = $.Deferred();
            var node = document.createElement('script');
            node.type = "text/javascript";
            node.src = url;
            var onload = function () {
                dtd.resolve();
            };
            $(node).load(onload).on('readystatechange', function () {
                if (node.readyState == 'loaded') {
                    onload();
                }
            });
            document.getElementsByTagName('head')[0].appendChild(node);
            
            return dtd.promise();
        }            

使用方法如下:

 $.when(this.promiseLoadScript("js/validateRules.js?v=" + Math.random())).then(function () {
                //your code
            });

这样就可以保证指定的js加载完毕之后再执行你的代码

 

posted @ 2016-09-02 16:49  嘿煤贵  阅读(888)  评论(0编辑  收藏  举报