构造jQuery插件
Structring jQuery plugins
我正在写一个jQuery插件,经常被某些函数的范围弄糊涂(使用jS时是传统的)。
一个简短的例子应该会有所帮助:
(function ( $ ) {
var methods = {
init: function ( options ) {
var settings = $.extend ({
a: 100,
b: 200
}, options);
return this.each(function(){
var $this = $(this);
var return_value = $this.plugintest("method_1", settings);
$this.plugintest("method_2", settings, return_value);
});
},
method_1 : function ( settings ) {
var method_1_value_1 = settings.a * 10,
method_1_value_2 = settings.a * 20;
return method_1_value_1;
},
method_2 : function ( settings, old_return_value ) {
// WHAT IF I WANT BOTH method_1_value_1 AND method_1_value_2 in here?
}
};
$.fn.plugintest = function (method) {
if ( methods[method] ) {
return methods[method].apply( this, Array.prototype.slice.call ( arguments, 1 ) );
} else if ( typeof method === 'object' || ! method ) {
return methods.init.apply( this, arguments );
} else {
$.error( 'Method ' + method + ' does not exist in jQuery.robottest' );
}
};
}) (jQuery);
参见方法_2。我想访问我在method_1中创建的值,但我只能返回1个值——我应该创建某种全局变量吗?做到这一点的"最佳"方法是什么?
变量在声明它们的函数中(即出现其var
语句的函数)以及在该函数中声明的任何函数中都是可见的。
这里有一个例子:
(function () {
var foo;
// foo is visible here, bar is not
// declare variables that should be visible to your whole plugin here
var methods = {
a: function () {
var bar;
// foo and bar are both visible here
},
b: function () {
// foo is visible here, bar is not
}
};
}());
// neither foo nor bar are visible here
您永远不应该使用全局变量(即未在函数内用var
语句声明的变量)。这些代码对文档中的所有其他代码都可见。但是,只要您将所有内容都包含在function
中并始终使用var
,您就安全了。
这是最好的开始:jQuery Boilerplate
函数中定义的变量将在函数范围内。在函数之前声明的任何内容都将在父作用域中。父作用域将由父作用域中的函数可见,具体取决于变量声明。
所以,如果您在父函数中声明变量,而不在内部函数中再次声明它们,将导致从内部函数访问这两个变量。
相关文章:
- 如何在Angular2中使用jQuery插件
- 如何使jQuery插件函数可调用以供独立使用,而不在集合上操作
- 水平视差滚动从头开始-没有插件(jQuery)
- 什么是最好的表单元素样式库/插件(jQuery)
- 如何在Bootstrap Modal上使用Vue.js渲染插件jQuery(作为工具提示和Switchery)
- 屏蔽输入插件 jquery
- 多选插件 jquery 不适用于 javascript
- 使用验证器插件 Jquery 验证动态输入表单元素
- 如何从网格数据表插件 jQuery 中清除数据
- 插件Jquery Validation的错误消息显示不正确
- Livestamp插件Jquery-如何显示时间
- Youtube跟踪JQuery插件JQuery .tubeplayer.js
- 创建句柄特性的拖放插件- jquery
- 如何使用表排序插件- jquery搜索表中的项
- Ajax文件上传进度没有任何插件Jquery
- 航路点插件Jquery
- 在数据表插件jQuery中设置分页长度
- 如何在OpenUI5/SAPUI5中使用jQuery插件(jQuery验证引擎)
- 时钟插件 jQuery
- jQuery插件'jQuery .shuffle.js'执行排序