Javascript 将$（此）选择器传递到嵌套函数中

因此，我有一个脚本，需要遍历父

DIV

中的每个

p

标记，类名为

entry content

，并使用google translate API翻译每个标记

因此，当用户单击链接将页面从英语翻译为西班牙语时，此功能将运行：

function spanish() {
$(".entry-content p").each(function(){
      var text = $(this).html();
        google.language.detect(text, function(result) {
          google.language.translate(text, "en", "es", function(result) {
           if (result.translation) {
                alert($(this).html());  //outputs NULL
                $(this).html(result.translation); //doesn't work
            }
          });
        });
      });
}

问题是当iGet进入内部函数

$（this）.html（）

comesback NULL时，我无法更改当前元素html以将其更改为新的翻译文本

所以我想我的问题是： 如何将当前选定的元素传递到嵌套函数中

---

谢谢

这是因为

此

更改了该回调中的上下文，只需保留对所需元素/对象的引用，如下所示：

function spanish() {
  $(".entry-content p").each(function(){
    var text = $(this).html(), self = this;
    google.language.detect(text, function(result) {
      google.language.translate(text, "en", "es", function(result) {
       if (result.translation) {
            $(self).html(result.translation);
        }
      });
    });
  });
}

---

在适当的上下文中保存“this”的记录-否则

此

指的是内部函数，而不是父函数

function spanish() {
$(".entry-content p").each(function(){

      // Save a record of 'this' in the proper context.
      var me = this;

      var text = $(this).html();
        google.language.detect(text, function(result) {
          google.language.translate(text, "en", "es", function(result) {
           if (result.translation) {
                alert($(me).html());  
                $(me).html(result.translation); 
            }
          });
        });
      });
}

function spanish() {
    $(".entry-content p").each(function(){
      var $this = $(this);
      var text = $this.html();
        google.language.detect(text, function(result) {
          google.language.translate(text, "en", "es", function(result) {
           if (result.translation) {
                alert($this.html());  //outputs NULL
                $this.html(result.translation); //doesn't work
            }
          });
        });
      });
}

---

您可以将其存储在局部变量中

this

的值始终与调用函数的上下文相关。在您的示例中，您正在将一个函数传递给

google.language.translate

，因此可能是

google.language.translate

调用该函数

function spanish() {
$(".entry-content p").each(function(){

      // Save a record of 'this' in the proper context.
      var me = this;

      var text = $(this).html();
        google.language.detect(text, function(result) {
          google.language.translate(text, "en", "es", function(result) {
           if (result.translation) {
                alert($(me).html());  
                $(me).html(result.translation); 
            }
          });
        });
      });
}

function spanish() {
    $(".entry-content p").each(function(){
      var $this = $(this);
      var text = $this.html();
        google.language.detect(text, function(result) {
          google.language.translate(text, "en", "es", function(result) {
           if (result.translation) {
                alert($this.html());  //outputs NULL
                $this.html(result.translation); //doesn't work
            }
          });
        });
      });
}

但是，如果将

$（this）

的值存储在

p

中，则可以从回调函数中使用该变量

function spanish() {
$(".entry-content p").each(function(){

      // Save a record of 'this' in the proper context.
      var me = this;

      var text = $(this).html();
        google.language.detect(text, function(result) {
          google.language.translate(text, "en", "es", function(result) {
           if (result.translation) {
                alert($(me).html());  
                $(me).html(result.translation); 
            }
          });
        });
      });
}

function spanish() {
    $(".entry-content p").each(function(){
      var $this = $(this);
      var text = $this.html();
        google.language.detect(text, function(result) {
          google.language.translate(text, "en", "es", function(result) {
           if (result.translation) {
                alert($this.html());  //outputs NULL
                $this.html(result.translation); //doesn't work
            }
          });
        });
      });
}

---

我会这样做。然后研究闭包以了解它在做什么

function spanish() {
$(".entry-content p").each(function(){
var $this = this; // new
      var text = $(this).html();
        google.language.detect(text, function(result) {
          google.language.translate(text, "en", "es", function(result) {
           if (result.translation) {
                alert($(this).html());  //outputs NULL
                $this.html(result.translation); 
            }
          });
        });
      });
}

---

现在看来很明显，谢谢你。作为子问题，我可以问一下为什么要使用$？var$this=$（this）之间有什么区别；var this=$（this）；嗯，

这是一个保留关键字。您仍然无法设置并从外部访问它
var anythingElse=$（this）
可以工作，您可以随意做任何事情
$this
在表示“jQuery包装的‘this’”时有点像惯例，但您可以随意使用。