我不明白jQuery .each（）和.html（）方法是如何工作的

Question

我是蒂莫。 我是网络编程的新手，我有这个问题。 我制作了一个包含3行的简单html表。 每个td必须具有随机数值。 我的问题是我的代码在每个td元素上放置相同的值。

http://jsfiddle.net/timosergio/30ydu4oe/

下面是我的js代码：

        $(function() {

            randomValues();
            //alert(1);
        });


    var randomValues = function(){
        var $td = $('.table').find('td');

        // each td has to have a different random value

        var random_values = Math.random() * 100 ;

        $td.each(function(i){

            //console.log(i + ":" + Math.random() * 100);

            $td.eq(i).text(random_values);

        });


    };

Answer 1

这是因为你生成一个随机值，然后使用每个td s，而不是为每个td生成一个新的td 。 所以：

$td.each(function(i){
    $td.eq(i).text(Math.random(Math.random() * 100));
});

换句话说，在循环内生成随机值，而不是在循环之外。

此外，要理解，在each回调中，上下文（即this ）指向正在考虑的元素。 所以你不需要

$td.eq(i).text(...

但仅仅是

$(this).text(...

Answer 2

$.each()本质上是一个foreach循环。 您需要在每次迭代时创建一个新的随机值。

像这样：

var randomValues = function() {
  var $td = $('.table').find('td');

  // each td has to have a different random value
  $td.each(function(i){
    //console.log(i + ":" + Math.random() * 100);

    var random_value = Math.random() * 100 ;

    $td.eq(i).text(random_value);

  });
}

Answer 3

这是因为您的随机值是在每个语句之前生成的，因此每次都使用相同的值。

将Math.random（）* 100移动到.text（）中，一切都应该有效。

Answer 4

该问题与.each()或.html()无关。 您只生成了一次随机值，并为每个td设置了相同的值。 你需要这样做。

var randomValues = function(){
        var $td = $('.table').find('td');

        // each td has to have a different random value

       // var random_values = Math.random() * 100 ;

        $td.each(function(i){

            //console.log(i + ":" + Math.random() * 100);

            $td.eq(i).text(Math.random() * 100);

        });


    };