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

Question

Im Timo。我是网络编程新手，我有这个问题。我做了一个简单的3行表格。每个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.each(function(i){ 
    $td.eq(i).text(Math.random(Math.random() * 100)); 
}); 

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

此外，要明白的是，在each回调中，上下文即this指向被考虑的元素。所以，你不需要

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

而仅仅

$(this).text(... 

Answer 2

这是因为每个语句之前生成的随机值，所以相同的值每次被使用。

把你的Math.random（）* 100移动到你的.text（）中，并且所有的都可以工作。

Answer 3

该问题与.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); 

     }); 


    }; 

Answer 4

$.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); 

    }); 
}