如何调用嵌套在JQuery插件内的函数? [英] How to call functions that are nested inside a JQuery Plugin?
问题描述
我的目标是能够调用我的JQuery插件内的函数。
My goal is to be able to call functions that are inside my JQuery plugin.
正确的语法是什么?
例如,这不起作用:
<a href="#" id="click_me">Click Me</a>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script>
(function($) {
$.fn.foo = function(options) {
do_stuff = function(){
console.log("hello world!"); // works
do_other_stuff = function(){
alert("who are you?");
}
} // function
} // function
})(jQuery);
$("body").foo();
$("#click_me").click(function(){
$.fn.foo.do_stuff.do_other_stuff(); // doesn't work
});
</script>
推荐答案
覆盖该名称的局部变量或将其添加到全局命名空间。 (所以你的do_stuff是一个全局函数,这不是你想要的)
when you assign functions to variables without the var keyword they either overwrite the local variable of that name or the are added to the global namespace. (so your do_stuff is a global function, which is not what you want)
一个方法来做你想要的是明确地给你想要你的函数驻留的位置。
one way to do what you want is to explicitly give where you want your function to reside.
(function($) {
$.fn.foo = function(options) {
// whatever $().foo() should do
};
$.fn.foo.do_stuff = function() {
console.log("hello world!");
};
$.fn.foo.do_stuff.do_other_stuff = function(){
alert("who are you?");
};
})(jQuery);
编辑:
这是因为javascript中的所有函数都是对象,这意味着你可以为任意属性赋值。
This works because all functions in javascript are objects, which means you can assign values to any arbitrary property.
如果你想访问其他函数的变量可以移动其他类型的定义:
If you want to access the variables of other functions you can move the definitions inside of the other ones like:
$.fn.foo.do_stuff = function() {
console.log("hello world!");
$.fn.foo.do_stuff.do_other_stuff = function(){
alert("who are you?");
};
};
但这意味着只有在运行其他函数时才定义函数,
but this will mean the function is only defined once you run the other function, and that each time you run the function it will overwrite the last definition.
可能更理想的解决方案是让每个函数返回一个包含嵌套函数的对象,如下所示:
Possibly a more ideal solution would be to have each function return an object containing the nested function like so:
(function($) {
$.fn.foo = function(options) {
// whatever $().foo() should do
var do_stuff = function(do_stuff_args) {
console.log("hello world!");
// do stuff with options and do_stuff_args
var do_other_stuff = function(other_args) {
alert("who are you?");
// here you have access to options, do_stuff_args, and other_args
};
return {
do_other_stuff: do_other_stuff
};
};
return {
do_stuff: do_stuff
}
};
})(jQuery);
并使用
foo().do_stuff(some_options).do_other_stuff(other_options);
或
var a = foo(stuff).do_stuff(some_options);
a.do_other_stuff(foo);
a.do_other_stuff(bar);
这篇关于如何调用嵌套在JQuery插件内的函数?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!