javascript - Javascript 闭包和范围问题

Question

我无法绕过javascript闭包。我想要 4 个随机数，但只能将最后一个复制 4 次。

Javascript

$(function() {      

  function setNewNumber(element) {
    return function (newNumber) {
      element.text(newNumber);
    }
  }

  $('.number').each(function() {
      $.get('http://www.random.org/integers/?num=1&min=1&max=6&col=1&base=10&format=plain&rnd=new', 
        setNewNumber($(this))
      );
  });

});

HTML

<div class="number"></div>
<div class="number"></div>
<div class="number"></div>
<div class="number"></div>

一个有效的 plunker 示例

有什么提示吗？

Answer 1

get请求正在被缓存。

http://jsfiddle.net/hCEbd/1/

（也就是说你对闭包的理解是正确的，代码也能正常工作）。

从评论中，因为这是相关的：

您可以根据他们的 API 在同一计时器上从 random.org 请求多个数字。不要使用四个请求，而是使用num=' + $(".number").length然后做一点解析

Answer 2

您尝试使用顶级功能实现的目标有点令人困惑。如果您只想为元素设置新的随机数，则不需要其中任何一个。

用于ajax为您的请求指定一些参数。特别是，您希望停止缓存您的请求。您还可以提供上下文来引用您的.number元素。

$('.number').each(function() {
  $.ajax({
      type: "GET",
      url: 'http://www.random.org/integers/?num=1&min=1&max=6&col=1&base=10&format=plain&rnd=new',
      context: this,
      success: function(data) { 
        $(this).text(data); 
      },
      cache: false
  });
});

这个解决方案在这里摆弄。

Answer 3

Works: http://plnkr.co/edit/XTOI20kGbFbzdtDaqpLZ

Your request is being cached. By the way, getting data in cycle - it's not a good idea.

Answer 4

任何 jquery ajax 请求，如 $.get，都会更改范围。如果你想重用你的 setNewWord 函数，它需要在全局范围内或在 get 的结果范围内。

看看jsfiddle。 http://jsfiddle.net/justengland/hJnXb/2/

function setNewWord(element) {
$('#output').append(element + '<br>');

}

$（函数（）{

$(numbers).each(function () {
    var url = 'http://www.random.org/integers/?num=1&min=1&max=6&col=1&base=10&format=plain&rnd=new';
    $.get(url, setNewWord);
});

});