使用requireJS的shim參数,完毕jquery插件的载入
没有requireJS框架之前,假设我们想使用jquery框架,会在HTML页面中通过<script>标签载入。这个时候jquery框架生成全局变量$和jQuery等全局变量。假设项目中引用了requireJS框架。採用模块化的方式载入jquery,那么jquery不会再加入全局变量$和jQuery。如今问题来了,尽管jquery框架已经開始支持AMD规范,可是jquery的众多插件还是不支持AMD,仍然像曾经一样须要使用全局变量$。
jquery插件大多都是例如以下结构:
(function( $, undefined ) {
})( jQuery );
假设我们项目中使用了jquery插件。可是jquery框架是通过requireJS载入的(不会加入全局变量$)。那怎么完毕jquery插件的载入呢?使用传统的方,在HTML页面中通过<script>载入jquery插件,肯定是不行的。
这个时候我们须要使用到
requireJS的shim參数,来完毕jquery插件的载入。以下我们以载入jquery-ui的slider插件为例:
requirejs.config({
shim: {
'jquery.ui.core': ['jquery'],
'jquery.ui.widget': ['jquery'],
'jquery.ui.mouse': ['jquery'],
'jquery.ui.slider':['jquery']
},
paths : {
jquery : 'jquery-2.1.1/jquery',
domReady : 'require-2.1.11/domReady',
'jquery.ui.core' : 'jquery-ui-1.10.4/development-bundle/ui/jquery.ui.core',
'jquery.ui.widget' : 'jquery-ui-1.10.4/development-bundle/ui/jquery.ui.widget',
'jquery.ui.mouse' : 'jquery-ui-1.10.4/development-bundle/ui/jquery.ui.mouse',
'jquery.ui.slider' : 'jquery-ui-1.10.4/development-bundle/ui/jquery.ui.slider'
}
});
require([ 'jquery', 'domReady','jquery.ui.core','jquery.ui.widget','jquery.ui.mouse','jquery.ui.slider'],
function($) {
$("#slider" ).slider({
value:0,
min: 0,
max: 4,
step: 1,
slide: function( event, ui ) {}
});
});
在path參数中,我们设置了模块名称(能够任意指定)和js文件路径的映射,然后在shim參数中,指定了模块名称和它的依赖数组,上面我们的jquery插件仅仅依赖于jquery框架。通过这样的方式,就能够使用requireJS完毕jquery和其插件的载入,不会有全局变量污染问题。
使用requireJS的shim參数,完毕jquery插件的载入的更多相关文章
- requirejs中 shim
使用requireJS的shim参数,完成jquery插件的加载 时间 2014-10-31 13:59:10 CSDN博客 原文 http://blog.csdn.net/aitangyong/ ...
- jQuery.ajax()方法中參数具体解析
前言 在项目开发中,为了实现异步向服务端发起请求,最常常使用的就是jQuery.ajax方法了.刚開始需求比較简单,调用jQuery.ajax方法时要传的參数也就那几个常见的參数:url/data/d ...
- jQuery UI dialog 參数说明
前段时间碰到个问题 jquery UI dialog弹出层 弹出多个层是 比方弹出两个层A和B B层假设显示的数据表格太大,伸到了A层的外面,那伸到A层之外的部分就看不到了,由于B层是在A层上弹出的 ...
- 使用requireJS的shim参数 解决插件 jquery.ui 等插件问题
没有requireJS框架之前,如果我们想使用jquery框架,会在HTML页面中通过<script>标签加载, 这个时候jquery框架生成全局变量$和jQuery等全局变量.如果项目中 ...
- jQuery(expression, [context]) , $(即jQuery)的參数问题
jQuery(expression, [context]) 返回值:jQuery 概述 这个函数接收一个包括 CSS 选择器的字符串,然后用这个字符串去匹配一组元素. jQuery 的 ...
- jquery ajax參数加点号状态200进error
今天开发中遇到一个非常恶心的问题: 用jquery中的ajax提交.发现假设參数中有点号的參数.后台正常返回200状态码的情况下也会走到error:function. 1. 參数data: " ...
- 【Jquery】jQuery获取URL參数的两种方法
jQuery获取URL參数的关键是获取到URL,然后对URL进行过滤处理,取出參数. location.href是取得URL.location.search是取得URL"?"之后的 ...
- jquery ui 分页插件 传入后台的连个參数名
參数名: page .rows page=int(request.form.get('page',1).encode('u8')) rows1=int(request.form.get('rows', ...
- httpUrlConnection的參数具体解释
post方式的的请求过程: // 设置是否向httpUrlConnection输出,由于这个是post请求,參数要放在 // http正文内,因此须要设为true, 默认情况下是false; http ...
随机推荐
- Android 关于文件及文件夹的创建 、删除、重命名、复制拷贝
package com.example.administrator.myapplication.util; import java.io.BufferedReader;import java.io.B ...
- windows 下安装 RabbitMQ
一.安装 RabbitMQ 前需要先安装 Erlang http://www.erlang.org/downloads 下下载对应版本的安装文件进行安装. 安装完成后配置环境变量: ERLANG_HO ...
- 雷林鹏分享:PHP Secure E-mails
在上一节中的 PHP e-mail 脚本中,存在着一个漏洞. PHP E-mail 注入 首先,请看上一章中的 PHP 代码: if (isset($_REQUEST['email'])) { // ...
- 使用HTML5+调用手机摄像头和相册
前言:前端时间使用HTML5做了一个WEB端APP,其中用到了H5页面调用手机摄像头的功能,当时也是花了不少时间去研究.最终是采用了HTML5plus(HTML5+)的方式完成了该功能,现将具体方法简 ...
- scrollfix.js插件:滚动固定在某个位置
插件文件在/文件 scrollfix.js 用法: var fix = $(".fix"), fixtop = $(".fix-top"), fixStartT ...
- react-native 手势响应以及触摸事件的处理
react-native 的触摸事件: TouchableHighlight , TouchableNativeFeedBack , TouchableOpacity , TouchableWitho ...
- Windows——bat中的路径和工具栏运行bat的坑
工具栏添加的批处理环境 编写一个简单的批处理文件 set testEnv = %cd% pause 这里第一句:设置当前文件夹路径为环境变量testEnv的值 这里第二句:暂停命令窗口 第一次我们直接 ...
- Linux修改启动界面、分辨率
初识Linux 初识Linux(Centos 7.x),积累一些小技巧. 修改命令行界面的分辨率 # 备份配置文件 # 有些系统路径是/boot/grub...或者/boot/grub/menu.ls ...
- 4_蒙特卡罗算法求圆周率PI
题目 蒙特卡罗算法的典型应用之一为求圆周率PI问题. 思想: 一个半径r=1的圆,其面积为:S=PI∗r2=PI/4 一个边长r=1的正方形,其面积为:S=r2=1 那么建立一个坐标系,如果均匀的向正 ...
- cogs1752[boi2007]mokia 摩基亚 (cdq分治)
[题目描述] 摩尔瓦多的移动电话公司摩基亚(Mokia)设计出了一种新的用户定位系统.和其他的定位系统一样,它能够迅速回答任何形如“用户C的位置在哪?”的问题,精确到毫米.但其真正高科技之处在于,它能 ...