建议项目结构:

HTML文件结构:

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body> Test <a id="aTest" href="#">Link1</a>
<a id="bTest" href="#" onclick="MyApi.foo()">Link2</a> <script data-main="js/app.js" src="js/require-min.js"></script> </body>
</html>

调用方式采用两种方式:

1、JS绑定aTest的onClick事件;(建议)

2、HTML代码中调用JS事件;

app.js

requirejs.config({
baseUrl:'js',
paths:{
}
}); var MyApi = {};
requirejs(['lib/jquery-1.11.2.min', 'app/fsub'],
function($, fsub){ fsub(); MyApi.foo = function(){
alert('Test');
};
}
);

app.js调用fsub

fsub.js:作用:初始化aTest的点击事件

define(['app/sub'],function(sub){
return function() {
$('#aTest').on('click',function(){
alert(sub.color+'ff');
});
}
});

sub.js:定义常量

define({
color:'black',
size:'unisize'
});

参考:http://requirejs.cn/

RequireJS示例的更多相关文章

  1. 转:requirejs打包压缩r.js使用示例

    为了应对日益复杂,大规模的JavaScript开发.我们化整为零,化繁为简.将复杂的逻辑划分一个个小单元,各个击破.这时一个项目可能会有几十个甚至上百个JS文件,每个文件为一个模块单元.如果上线时都是 ...

  2. RequireJS与SeaJS模块化加载示例

    web应用越变的庞大,模块化越显得重要,尤其Nodejs的流行,Javascript不限用于浏览器,还用于后台或其他场景时,没有Class,没有 Package的Javascript语言变得难以管理, ...

  3. 转: requirejs压缩打包r.js使用示例 2 (~~很详细的教程)

    这一篇来认识下打包工具的paths参数,在入门一中 就介绍了require.config方法的paths参数.用来配置jquery模块的文件名(jQuery作为AMD模块时id为“jquery”, 但 ...

  4. 使用requirejs来管理angularJS依赖示例

    有关requirejs是什么在这里不做解释,只用纯代码实战让你感受requirejs依赖管理的强大. 一.首先要先下载require.js,然后整一个入口文件main.js包括了对其他js的引用. / ...

  5. requirejs配置代码示例

    requirejs大致用法:通过定义模板define()再通过require()或requirejs()加载模板,paths是路径,如果路径长可以把它赋一个短名称加入ruquire()中,shim是兼 ...

  6. RequireJS 模块的定义与加载

    模块不同于传统的脚本文件,它良好地定义了一个作用域来避免全局名称空间污染.它可以显式地列出其依赖关系,并以函数(定义此模块的那个函数)参数的形式将这些依赖进行注入,而无需引用全局变量.RequireJ ...

  7. 浅谈HTML5单页面架构(三)—— 回归本真:自定义路由 + requirejs + zepto + underscore

    本文转载自:http://www.cnblogs.com/kenkofox/p/4650310.html 不过,这一篇,我想进一步探讨一下这两个框架的优缺点,另外,再进一步,抛开这两个框架,回到本真, ...

  8. requirejs使用

    实现模块化.按需加载. 一.配置参数. 1.baseUrl:以一个相对于baseUrl的地址来加载所有的代码.   data-main,使用它来启动脚本加载过程,而baseUrl一般设置到与该属性相一 ...

  9. 新建一个angularjs+requirejs+bootstrap+typescript+gulp+vscode+git的项目

    环境 windows 10 准备工具 Visual Studio Code Node.js Git 需求 必须支持IE8 步骤开始: 执行命令行工具 mkdir Demo && cd ...

随机推荐

  1. 版本控制、SVN、VSS

    ylbtech-Miscellaneos: 版本控制.SVN.VSS 1.A,版本控制返回顶部 1, 版本控制(Revision control)是一种软体工程技巧,籍以在开发的过程中,确保由不同人所 ...

  2. LNMP环境搭建配置memcache

    原始出处  http://iceeggplant.blog.51cto.com/1446843/819576 memcached是高性能的,分布式的内存对象缓存系统,在动态应用中减少数据库负载,提升访 ...

  3. 为什么选择centos,而不是Dibian、Ubuntu【转】

    我们运行着一些全球最大的互联网的营运,因此我们对可靠性和稳定性非常重视,是我们的第一要务.为此,我们只使用Linux来支撑顾客的系统.但是,我们应该使用哪一个Linux的发行版?答案是,CentOS. ...

  4. C++学习4

    在C++中,定义函数时可以给参数指定一个默认的初始值.调用函数时,可以省略有默认值的参数.也就是说,如果用户指定了参数的值,那么就使用用户指定的值,否则使用参数的默认值. C++规定,默认参数只能放在 ...

  5. Grid++Report的几点总结

    一.同事解决方案: 1.在View文件夹下建立报表文件A,用来作为报表呈现的载体.这个页面负责加载报表模板与加载数据源.其中报表模板由于后缀名为grf,在MVC中不做任何修改的情况下,系统会做路由处理 ...

  6. AOP切入点注解报错

    开始学习AOP,出现如下的错误,最后发现是JDK与aspectj,aspectjweaver版本问题造成的.之后改成最新版本,代码运行正常. 利用这些特性可以进行代码的插入,比如权限,缓存结合mecm ...

  7. Rolling Cursor Invalidations with DBMS_STATS.AUTO_INVALIDATE (文档 ID 557661.1)

      Rolling Cursor Invalidations with DBMS_STATS.AUTO_INVALIDATE (文档 ID 557661.1) 转到底部 In this Documen ...

  8. css margin-top设置html元素之间的距离

    css margin-top属性设置的是一个元素的顶端与另一个元素之间的距离.这个距离称为上外边距,本文章向大家介绍css margin-top属性的用法和实例,需要的朋友可以参考一下. css ma ...

  9. Oracle VM VirtualBox 安装笔记

    [CentOS 6] 1.在官网下载VirtualBox-4.2-4.2.16_86992_el6-1.x86_64.rpm安装. 2.YUM安装kernel-devel包. 3.把用户加入vboxu ...

  10. Html类ImageGetter接口

    public class ImgLabelActivity extends Activity { private static final String TAG = "ImgLabelAct ...