html引入layer.js,require.js引用jquery、layer的简单实例用法

来源: 未知

发布时间: 2017-10-13

次浏览

用法：

第一步在html页面上引入JS：

第一个require.js,注意引用的时候加了一个data-main="./index"，其中里面的index就是第三个引用的index.js的名字

第二个requirejs-config我们需要配上插件的路径

代码如下

// 获取基础路径

function getBaseURL() {

if (!window._baseUrl) {

var local = window.location;

var contextPath = local.pathname.split("/")[1];

//window._baseUrl = local.protocol + "//" + local.host + "/" + contextPath + "/";//加项目名：如http://localhost:8080/pro

window._baseUrl = local.protocol + "//" + local.host + "/";//不加项目名：如http://localhost:8080

}

return window._baseUrl;

};

window.CLIENT_PATH=getBaseURL();

// 基础配置

window.requireConfig = {

"baseUrl": window.CLIENT_PATH,

"paths": {

"jquery" : "assets/jquery/jquery-1.9.1",/* jquery */

"layer" : "assets/layer/layer",/*layer弹窗*/

"underscore": "assets/lodash/underscore-min",/*underscore模板*/

},

"shim": {

"layer": {

"deps": ["jquery"]

}

}

};

function require_js(name, url, deps) {

window.requireConfig["paths"][name] = url;

if (deps) {

window.requireConfig["shim"][name] = {

"deps": deps

};

}

}

//依赖前置，引用某个JS的时候把另一个提前引用一下

function require_shim(name, deps) {

if (!window.requireConfig["shim"][name]) {

window.requireConfig["shim"][name] = {

"deps": deps

};

} else {

window.requireConfig["shim"][name]["deps"] = window.requireConfig["shim"][name]["deps"].concat(deps);

}

}

//服务端地址

window._serverPath="http://xxx.xxx.xx.xx:xxxx";

第三个index.js就是程序主入口

代码如下

require_js('Config', 'require/js/config');

//执行配置

require.config(window.requireConfig);

define('index',function(require,exports,module){

var $=require('jquery');

var layer=require('layer');

var Config = require('Config');

layer.config({

path: window._baseUrl + 'assets/layer/' //layer.js所在的目录，可以是绝对目录，也可以是相对目录

});

var layerIndex = null;

var Page={

init:function(){

layer.alert(Config.a);

}

};

$(function() {//程序入口

Page.init();

});

window.Config = Config;//把常量提供到页面上

});