没有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插件的载入的更多相关文章

  1. requirejs中 shim

    使用requireJS的shim参数,完成jquery插件的加载 时间 2014-10-31 13:59:10  CSDN博客 原文  http://blog.csdn.net/aitangyong/ ...

  2. jQuery.ajax()方法中參数具体解析

    前言 在项目开发中,为了实现异步向服务端发起请求,最常常使用的就是jQuery.ajax方法了.刚開始需求比較简单,调用jQuery.ajax方法时要传的參数也就那几个常见的參数:url/data/d ...

  3. jQuery UI dialog 參数说明

    前段时间碰到个问题 jquery UI dialog弹出层 弹出多个层是 比方弹出两个层A和B  B层假设显示的数据表格太大,伸到了A层的外面,那伸到A层之外的部分就看不到了,由于B层是在A层上弹出的 ...

  4. 使用requireJS的shim参数 解决插件 jquery.ui 等插件问题

    没有requireJS框架之前,如果我们想使用jquery框架,会在HTML页面中通过<script>标签加载, 这个时候jquery框架生成全局变量$和jQuery等全局变量.如果项目中 ...

  5. jQuery(expression, [context]) , $(即jQuery)的參数问题

    jQuery(expression, [context])         返回值:jQuery 概述 这个函数接收一个包括 CSS 选择器的字符串,然后用这个字符串去匹配一组元素. jQuery 的 ...

  6. jquery ajax參数加点号状态200进error

    今天开发中遇到一个非常恶心的问题: 用jquery中的ajax提交.发现假设參数中有点号的參数.后台正常返回200状态码的情况下也会走到error:function. 1. 參数data: " ...

  7. 【Jquery】jQuery获取URL參数的两种方法

    jQuery获取URL參数的关键是获取到URL,然后对URL进行过滤处理,取出參数. location.href是取得URL.location.search是取得URL"?"之后的 ...

  8. jquery ui 分页插件 传入后台的连个參数名

    參数名: page .rows page=int(request.form.get('page',1).encode('u8')) rows1=int(request.form.get('rows', ...

  9. httpUrlConnection的參数具体解释

    post方式的的请求过程: // 设置是否向httpUrlConnection输出,由于这个是post请求,參数要放在 // http正文内,因此须要设为true, 默认情况下是false; http ...

随机推荐

  1. Pycharm 设置python文件自动生成头部信息模板

    设置头部信息路径: 打开File—Settings—Editor—File and Code Templates—Python Script 输入要自动生成的头部信息模板 这样,新建py文件就会自动生 ...

  2. sosoapi的安装

    sosoapi简介及其用户手册:http://www.sosoapi.com/pass/help/manual.htm 该随笔的大概分为: 1.sosoapi的基础安装  2.sosoapi使用域名访 ...

  3. AngularJS小练习20170508

    首先可能需要安装npm,并且配置环境. 1.打开Dos(命令提示符).按Windows徽标键+R组合键,输入cmd然后按回车键进入Dos. 2.安装Yeoman.在Dos下输入npm install ...

  4. tcp案例之文件下载器

    文件下载器客户端 import socket def main(): # 1.创建一个tcp socket tcp_client_socket=socket.socket(socket.AF_INET ...

  5. SSH安全服务

    ssh安全服务     client \ sever     ssh: secure shell, protocol, 22 / tcp, 安全的远程登录, 基于RSA或DSA实现身份认证     两 ...

  6. 关于c# .net爬虫

    刚开始听到爬虫这两个字眼的时候感觉挺稀奇的,之前并没有接触过爬虫,正好这会手上没事,于是便百度了一下. 1.网络爬虫(又被称为网页蜘蛛,网络机器人,在FOAF社区中间,更经常的称为网页追逐者),是一种 ...

  7. About SQL Server 2014 SP1

    其实补丁这个月初就放出,个人懒惰所以也没怎么写归整文档 官方Blog: http://blogs.technet.com/b/dataplatforminsider/archive/2015/05/1 ...

  8. em的理解

    em 版本:CSS1 说明: 自己的理解: 注意地方: 浏览器默认大小为16px. 谷歌浏览器最小字体为12px. font-size;有继承性. 判断步骤: []看该元素本身有没有设置字体大小: 有 ...

  9. STM32F407 GPIO 库函数编程套路(led与beep总结) 个人笔记

    本文由正点原子STM32F407探索者开发板的led和beep实验,总结了gpio编程的套路. 下文中以hardware 来称呼可能的硬件外设,如led或beep等. 新建项目后主要用到三个文件:ha ...

  10. Spring Data Jpa系列教程--------实体解析和关联关系

    Spring Data Jpa是基于HIbernate开发的,所以建立实体建的实体和映射关系需要好好好的去了解一下,本文有以下内容,实体管理器介绍,实体与数据库表的映射介绍,关联关系(一对多,多对多) ...