建议项目结构:

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. 图片--Android加载图片导致内存溢出(Out of Memory异常)

    Android在加载大背景图或者大量图片时,经常导致内存溢出(Out of Memory  Error),本文根据我处理这些问题的经历及其它开发者的经验,整理解决方案如下(部分代码及文字出处无法考证) ...

  2. Java注解教程:自定义注解示例,利用反射进行解析

    Java注解能够提供代码的相关信息,同时对于所注解的代码结构又没有直接影响.在这篇教程中,我们将学习Java注解,如何编写自定义注解,注解的使用,以及如何使用反射解析注解. 注解是Java 1.5引入 ...

  3. Android之访问下载文件

    1.SD卡操作类 FileUtils.java package com.example.mars_1500_download; import java.io.File; import java.io. ...

  4. How To Easily Call WCF Services Properly z

    Please note: this article has been superceded by the documentation for the ChannelAdam WCF Library. ...

  5. Failed to create the java virtual machine完全解决办法

    一直用EcliPSe开发java,突然有这么一天,无法启动了,splash窗口显示“Failed to create the Java Virtual Machine”,结果发现eclipse和mye ...

  6. [Java] 字符流Reader,读取字符数据

    package test.stream; import java.io.BufferedReader; import java.io.FileNotFoundException; import jav ...

  7. 数组排序-冒泡排序-选择排序-插入排序-希尔排序-快速排序-Java实现

    这五种排序算法难度依次增加. 冒泡排序: 第一次将数组相邻两个元素依次比较,然后将大的元素往后移,像冒泡一样,最终最大的元素被移到数组的最末尾. 第二次将数组的前n-1个元素取出,然后相邻两个元素依次 ...

  8. PS 的参考线

    新建参考线 菜单:"视图-新建参考线", 直接输入想要位置的参考线.   参考线对齐 按住Shift键拉辅助线,辅助线会自动对齐到当前标尺的刻度上.           按住Alt ...

  9. [kuangbin带你飞]专题十五 数位DP

            ID Origin Title   62 / 175 Problem A CodeForces 55D Beautiful numbers   30 / 84 Problem B HD ...

  10. String Format for DateTime

    This example shows how to format DateTime using String.Format method. All formatting can be done als ...