jQuery插件支持AMD的写法改造
2017-10-20 09:00
429 查看
明确需求:改造自己的jquery插件,让其支持AMD的加载方式
这样直接就可以使用requirejs的方式动态加载jquery及其插件了,调用方式和全局调用方式相同。
原jQuery插件的写法
(function ($) { $.fn.myPlugin = function () { // 插件代码 }; })(jQuery);
改造后的jQuery插件写法
;(function (factory) { if (typeof define === "function" && define.amd) { // AMD模式 define([ "jquery" ], factory); } else { // 全局模式 factory(jQuery); } }(function ($) { $.fn.jqueryPlugin = function () { //插件代码 }; }));
在Requirejs中配置
关键代码示例:require.config({ baseUrl: './', paths: { jquery: ['lib/jquery/jquery-1.12.4'], jqueryYourPlugin: ['lib/jquery/jquery.yourplugin'] } });
在需要的模块中动态加载
define(['jquery', 'jqueryYourPlugin'], function ($, jqueryYourPlugin) { // 在这里开始使用你的插件代码,通过选择器调用或者直接调用,根据自己的插件代码 eg: // $("your selector").yourMethod(); });
这样直接就可以使用requirejs的方式动态加载jquery及其插件了,调用方式和全局调用方式相同。
相关文章推荐
- 改造jQuery-Tagit 插件支持中文全角的逗号和空格
- 如何改造jquery 插件符合amd 规范示例
- JQuery插件的写法
- JQuery插件中的treeview与asp.net mvc的结合使用实例(转)-附加自己的写法
- 今天试了两个显示 pdf 的 js 插件,pdf js 比较好使,jquery media js 不支持 firefox
- jQuery 人脸识别插件,支持图片和视频
- jQuery万能图片切换插件powerSwitch应用(支持同一页面多次调用)
- Eclipse安装插件支持jQuery智能提示
- 分享一个快速将传统表单转化为AJAX支持的表单的jQuery插件 - ALAJAX
- 移动端翻页插件dropload.js(支持Zepto和jQuery)
- Eclipse安装插件支持jQuery智能提示
- 支持Lazy loading的图片画廊jQuery插件 - Least.js
- JQuery表格插件:鼠标移过变色,双击打开新页面,单选(支持多选)变色
- Jquery的validate,清除form方法,显示密插件,正则特殊字符处理,js的call用法,ajax,h5支持情况,elclipse tomcate去掉项目名,js 的原型
- 70个jQuery触摸事件插件 - 支持手势触摸!
- 自定义jQuery插件的写法
- 关于 页面多语言支持的纯前端(JQuery插件)实现及 .json 文件读取报404的问题
- 支持同一页面多次使用,jquery imageShown 插件 可以完成任何内容的轮显切换
- 基于 jQuery支持移动触摸设备的Lightbox插件
- jquery的插件写法