使用seajs来引入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>

使用seajs来引入js代码

相关推荐