使用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 ...
随机推荐
- mysql5.7 this is incompatible with sql_mode=only_full_group_by错误
解决办法: https://blog.csdn.net/qq_42175986/article/details/82384160 前言: 一.原理层面 这个错误发生在mysql 5.7 版本及以上版本 ...
- flutter 实现圆角头像的2种方法
圆角头像在开发中应用太普遍了,我总结了2种实现方法,分享给大家 方法一: 使用Container组件的decoration可以实现 Container( width: 40, height: 40, ...
- (独孤九剑)--PHP简介与现况
(1)为什么学习PHP? 1.好就业: 2.入门简单,学习周期短,两个月即可: 3.学习编程思路,使编程习惯更加规范: 4.大公司直招: 5.处理大并发数据: 6.开源,所以更加安全 (2)PHP是什 ...
- Android全局异常捕获
PS:本文摘抄自<Android高级进阶>,仅供学习使用 Java API提供了一个全局异常捕获处理器,Android引用在Java层捕获Crash依赖的就是Thread.Uncaught ...
- 第3节 mapreduce高级:5、6、通过inputformat实现小文件合并成为sequenceFile格式
1.1 需求 无论hdfs还是mapreduce,对于小文件都有损效率,实践中,又难免面临处理大量小文件的场景,此时,就需要有相应解决方案 1.2 分析 小文件的优化无非以下几种方式: 1. 在数据 ...
- delphi byte to of set
最佳方案 type // Controls.TCMMouseWheel relies on TShiftState not exceeding 2 bytes in size TShiftState ...
- python闭包浅见
1.个人理解定义:在一个函数A内部定义一个函数B,并在定义的内部函数B内对这个函数A的变量进行引用,那么内部函数B就是闭包. 2.特性:在内部函数内不能对A函数的变量进行更改 (但是可以将其封装到一个 ...
- Spring Boot . 2 -- 用Spring Boot 创建一个Java Web 应用
通过 start.spring.io 创建工程 通过 IDEA 创建工程
- struct 和class 区别
最开始,就让我们来讨论一下一个最最基本,也最最容易被人忽视掉的问题——C++中的struct和class有什么区别?如果谈到C中的struct和C++中的class的区别,你应该会告诉我很多.但我现在 ...
- C++中的初始化列表
C++11扩大了列表初始化的适用范围,使其可以用于所有内置类型和用户定义的类型(即类对象). 1.当列表初始化用于内置类型的变量时,这种初始化形式有一个重要的特点:如果我们使用列表初始化且初始化值存在 ...