如何调用嵌套在JQuery插件中的函数?

我的目标是能够调用我的JQuery插件中的函数。

什么是正确的语法?

例如,这不起作用:

Click Me   (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 });  

当您为没有var关键字的变量分配函数时,它们会覆盖该名称的局部变量,或者将其添加到全局名称空间。 (所以你的do_stuff是一个全局函数,这不是你想要的)

做你想做的事的一种方法是明确地给你想要你的function所在的位置。

 (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中的所有函数都是对象,这意味着您可以为任意属性赋值。

如果要访问其他函数的变量,可以将定义移到其他函数中,如:

 $.fn.foo.do_stuff = function() { console.log("hello world!"); $.fn.foo.do_stuff.do_other_stuff = function(){ alert("who are you?"); }; }; 

但这意味着只有在运行其他函数时才会定义该函数,并且每次运行该函数时它都会覆盖最后一个定义。

可能更理想的解决方案是让每个函数返回一个包含嵌套函数的对象,如下所示:

 (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);