Javascript 将jQuery.click（）函数作为变量传递

我正在使用一个选项卡式界面，并设置了以下jQuery函数来处理选项卡的单击事件

$(document).ready(function () {

    $('a#foo').click(function() {
        //content, various calls
        return false;
    });
});

上面是我的一个选项卡的示例，其他选项卡也在同一个document ready块中。我需要做的是使当前选择的选项卡无法重新单击，并且在其他一些情况下，如果需要，我可以手动禁用选项卡。我通过以下途径实现了这一目标：

$('a#play').unbind('click');    

function Foo() {
    //same content and calls as before
    return false;
}


$('a#foo').click(Foo);    
$('a#foo').bind('click', Foo);

这很好，当然会禁用选项卡，但问题是重新绑定曾经存在的单击操作。我通过bind函数实现了这一点：

$('a#foo').bind('click', function() {
//the same content and calls as before
return false;
});

这也很好，但随着我在UI中添加选项卡，它变得非常混乱。立即的解决方案似乎是将函数创建为变量，然后将其传递到初始的单击创建和绑定事件中。像这样：

var Foo = new function() {
    //same content and calls as before
    return false;
}

$('a#foo').click(Foo());

$('a#foo').bind(Foo());

出于这样或那样的原因，这似乎导致了浏览器崩溃问题。在这种情况下，是否不可能将函数作为var传递，或者我只是做错了？或者，有没有更好的方法来实现我所期待的结果？谢谢

$('a#foo').click(Foo());

$('a#foo').bind(Foo());

Foo

为您提供了函数，但在它之后添加

（）

，意味着您正在调用函数，而不是传递函数本身。由于您正在调用函数，

false

最终被传递到

click

和

bind

，显然没有做任何事情。其他一些问题可能是由于您模拟切换到该选项卡两次（调用事件处理程序两次）造成的

^^你应该做你想做的

---

或者，有没有更好的方法来实现我所期待的结果

目前，我们对您的设计真正了解的是，您正在使用单击事件处理程序调用以切换选项卡。这一部分非常棒，但是我们需要更多的信息来为您提供您真正想要的更深入的答案。如果您将代码发布到

Foo

中，我们将能够提供更多帮助：D

---

编辑：归功于SLaks♦ 注意到我遗漏的函数声明中的

新的

。我将在他的解释中添加更多细节：

当您编写var foo=new时 函数（…）{…}，您正在创建一个 函数文本，然后将其作为 构造器

相当于

var SomeClass = function(...) { ... };
var foo = new SomeClass;

var SomeClass=函数（…）{…}； var foo=新的SomeClass

没有SomeClass伪变量

function（）{}

正如您所期望的那样是一个匿名函数new更令人困惑。当调用函数并在其前面加上

new

时，您正在使用该函数实例化函数中定义的类的实例。在JS中，与大多数其他语言不同，类的整个定义都在一个构造函数中，您可以从中设置所有实例变量，如下所示：

Foo = function() { 
    this.a = "lala";
    this.b = 5;
}

---

要创建“类”的实例方法，可以使用prototype属性然而我刚刚意识到我已经完全偏离了主题。请阅读更多关于此和：D

您需要从函数定义中删除

new

，并在使用函数时停止调用该函数

当您编写

var foo=new function（…）{…}

时，您正在生成一个函数文本，然后将其作为构造函数调用

相当于

var SomeClass = function(...) { ... };
var foo = new SomeClass;

没有

SomeClass

伪变量

您只需将函数文本分配给变量

---

当您编写

。单击（foo（））

，您正在调用

foo

，并将结果传递给

click

除非

foo

返回一个函数，否则这不是您想要做的

---

您需要通过删除括号来传递

foo

本身。

因此，首先，单击接受一个函数，但在没有（）的情况下调用，因为准备就绪后，单击将运行该函数。通过添加（）可以直接调用它

其次，bind接受一个字符串（绑定到哪个事件）和一个函数（如上所述）

使用以下命令：

$('a#play').unbind('click');    

function Foo() {
    //same content and calls as before
    return false;
}


$('a#foo').click(Foo);    
$('a#foo').bind('click', Foo);

希望有帮助：）

试试：

var foo = function() // not "new function", as this creates an object!
{
    return false;
}

$("a#foo").click(foo); // not "Foo()", as you can't call an object!

---

为了更好地实现您想要的结果，您可以在每个选项卡上设置一个类，例如

.tab

。这样，您就可以：

$("a.tab").click(function() { return false; });

---

。。。不必用大量的

id

s来打发时间。

采取不同的方法，不要

解除绑定（）

我假设选项卡都在一个公共容器中。如果是这样，只需使用该方法在容器上放置一个处理程序

下面是一个通用代码示例：

$('#container').delegate('.tab:not(.selected)', 'click', function() {
    $(this).addClass('selected')
           .siblings('selected').removeClass('selected');
    // rest of the tab code
});

这将仅触发对未选择
.selected
类的
.tab
元素的单击。您需要修改特定代码。
添加括号将调用函数，但如果您想使其更酷，可以使其更有趣，以便Foo返回要绑定的函数

function Foo(){

    return function(){
        //your onclick event handler here.
    };
}

$('a#bar').bind(Foo())

这就利用了javascript函数编程方面的闭包，闭包很酷，但不如其他一些答案那么有效。你应该做一些关于闭包的研究，因为它们可以用来制作一些很酷的东西。
哇，这整条线索信息丰富/方便。我甚至从未意识到JS函数是这样工作的。非常感谢大家，感谢@CrazyJugglerDrummer将这一切整合在一起，发挥了巨大的魅力！