动态加载js

1、每个页面引入文件:init.js

function loadJs(jsFiles){
	var jsFile, defaultJsFiles=[global_path+'/resources/js/phone/zepto.min.js',global_path+'/resources/js/phone/common.js'];
	if(jsFiles){
		defaultJsFiles = jsFiles;
	}
	if(defaultJsFiles.length==0){
		return;
	}
	jsFile = defaultJsFiles.shift();
	var script, head  = document.head || document.getElementsByTagName( "head" )[0] || document.documentElement;
		script = document.createElement( "script" );
		script.charset = "utf-8";
		script.src = jsFile;
		script.onload = script.onreadystatechange = function() {
			if (!this.readyState || /loaded|complete/.test( this.readyState ) ) {
				this.onload = this.onreadystatechange = null;
				script = undefined;
			}
			loadJs(defaultJsFiles);
		};
		head.insertBefore( script, head.firstChild );
}
loadJs();

 2、common.js

//初始化
$(function(){
	toggleNav();
});
//隐藏底部菜单
function toggleNav(){
	$("input,textarea").each(function(){
		$(this).bind("focus",function(){
			if($("#all_b_menu").length>0){
				$("#all_b_menu").css({"display":"none"});
			}
		});
		$(this).bind("blur",function(){
			if($("#all_b_menu").length>0){
				$("#all_b_menu").css({"display":"block"});
			}
		});
	});
}

 3、要点

为什么要用递归?

因为动态引入的两个js文件有依赖关系,而且js文件的加载时异步的,所以需要等待基类资源加载完再加载后面的文件,不然找不到依赖的函数。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值