您的位置:首页 > Web前端 > JavaScript

使用seajs来引入js代码

2017-03-01 10:23 323 查看
新学的引用js文件的方法

注意的是:引入jquery的代码最好放在html文件中,本文是为了说明seajs中require如何使用的,才将jquery放入seajs中的。

html中对应的代码:

<script type="text/javascript" src="../js/lib/sea.js"></script><!--这里一定要引入sea.js下面才能使用seajs.use()函数-->
<script type="text/javascript">
seajs.use(['../js/zyl'],function(init) {
init();
});
</script>


(注意的是
function(init)中的参数init




对应的js代码:

define(function(require, exports, module){
require('./lib/jquery.min');//该模块需要引入的js文件。使用require来引入,这样的好处是需要这些js文件时才引入,而不是一开始就全部放在html中引入
function bindEvents(){    //编写核心函数代码
$('.zuobiaoxi td').click(function() {    //前提是html中需要引入jquery
$(this).addClass('td_curr').siblings().removeClass('td_curr').parents().siblings().find('td').removeClass('td_curr');
$(this).find('.round').addClass('curr').parents().siblings().find('.round').removeClass('curr');
});
}
var init = function(){
bindEvents();
}
module.exports = init;
})


 这里的

seajs.use(['../js/zyl'],function(init) {

});


就是引入了zyl.js文件,运行zyl.js文件。如果函数中不写init();那么对应的zyl.js文件就要执行init函数()

define(function(require, exports, module){
require('./lib/jquery.min');//该模块需要引入的js文件。使用require来引入,这样的好处是需要这些js文件时才引入,而不是一开始就全部放在html中引入
function bindEvents(){    //编写核心函数代码
$('.zuobiaoxi td').click(function() {    //前提是html中需要引入jquery
$(this).addClass('td_curr').siblings().removeClass('td_curr').parents().siblings().find('td').removeClass('td_curr');
$(this).find('.round').addClass('curr').parents().siblings().find('.round').removeClass('curr');
});
}
var init = function(){
bindEvents();
}
init();//这里做了改动
})


 此外,还可以在zyl.js中写多个函数,然后使用
module.exports = dialog;来向外提供接口,这样在html中引入的js中就可以直接使用dialog();执行。(如果不写

module.exports = dialog;)则,html中写dialog()不再起作用。
)
则js代码为:


define(function(require, exports, module){
require('./lib/jquery.min.js');
function bindEvents(){    //编写核心函数代码
$('.zuobiaoxi td').click(function() {    //前提是html中需要引入jquery
$(this).addClass('td_curr').siblings().removeClass('td_curr').parents().siblings().find('td').removeClass('td_curr');
$(this).find('.round').addClass('curr').parents().siblings().find('.round').removeClass('curr');
});
}

var init = function(){
bindEvents();
}
var dialog=function(){
alert('hello');
}
module.exports = init;
//或者使用init();
module.exports = dialog;
})


对应的html代码为:

<script type="text/javascript" src="../js/lib/sea.js"></script><!--这里一定要引入sea.js下面才能使用seajs.use()函数-->
<script type="text/javascript">
seajs.use(['../js/zyl.js'],function(init) {
init();
dialog();
});
</script>


原文
http://www.cnblogs.com/xiaozhumaopao/p/5895298.html
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐