Question

假设我有以下代码

$("p").bind("click", function(){
  alert( $(this).text() );
});

当用户点击<p>时，会显示一条提醒。这里有什么好处，就是我使用了“this”关键字。

现在我想摆脱匿名函数（每个脚本多次使用它）;

$("p").bind("click", myfunction());
myfunction(){
  alert( $(this).text() );
}

现在引用Window。我该怎么做才能解决这个问题？

更新

回答者提出的实际有效的建议解决方案

$(function(){
    $("p").bind("click", function() { myfunction($(this));});

    function myfunction(elem)
    {
      alert( elem.text() );
    }
});

这很好，但是每次调用这行代码都会创建一个新函数，不是吗？

Answer 1

您想将原始的“this”（上下文）传递给函数。

在Javascript中，这是通过使用call来完成的。例如，请参阅here

所以我修改了Jonathon的回答：

$("p").bind("click", function(){ myFunction.call(this); });

function myfunction(){
  alert($(this).text());
}

添加了：

我查找了jquery bind并且Jonathon是正确的，上下文自动设置为您要添加事件侦听器的原始元素。

我认为真正的问题是你没有正确传递函数ref。

尝试

$("p").bind("click", myfunction);
var myfunction = function(){
  alert( $(this).text() );
}

Answer 2

像

这样的东西

$(function(){
    $("p").bind("click", function() { myfunction($(this));});

    function myfunction(elem)
    {
      alert( elem.text() );
    }
});

此处您还没有删除匿名函数。但在里面你可以调用另一个函数。

Answer 3

我只是想，你为什么要那样做？

$("p").bind("click", function(){
  alert( $(this).text() );
});

当你可以添加更多这样的选择器时：

$("p,div,li,:button").bind("click", function(){
  alert( $(this).text() );
});

Answer 4

您可以这样做以获取调用处理程序的真实元素..

function myfunc(e)
{
  var _this = e.currentTarget;
  alert( $(_this).text());
}

根据jQuery documentation

event.currentTarget

说明：当前的DOM元素   在事件冒泡阶段。

版本添加：1.3

此属性将始终等于   该函数的 this 。

Answer 5

问题在于，您的事件处理程序正在调用函数myfunction()，而不是传递对它的引用myfunction。这就改变了它运行的范围。如果你传递一个参数myfunction，那么“this”应该按预期工作。

更一般地说，如果您真正关心的是知道哪个元素引发了事件，请使用jQuery传递给事件处理程序的规范化事件对象：

$("p").bind("click", function(evt) {
  // this === evt.target;

  alert($(evt.target).text());
});

或者：

$("p").bind("click", myfunction);

myfunction(evt) {
  alert($(evt.target).text());
}

为非匿名函数绑定此关键字

5 个答案: