需要javascript函数的数组输出

Question

查看此fiddle 对于我正在使用的所有正在运行的代码

我有一个数组i=[10,20,30,40,50,60,70]

我得到的输出为

70:checkbox(checked value 70) .

我需要显示所有数组及其复选框，以便我可以检查我想要的任何数字并检索检查的 ID

想要的输出：

70:checkbox(checked value 70)
60:checkbox(checked value 60)
50:checkbox(checked value 50)
40:checkbox(checked value 40)
30:checkbox(checked value 30)
20:checkbox(checked value 20)
10:checkbox(checked value 10)

上述小提琴的代码在这里： JS

    var i=[10,20,30,40,50,60,70]; 

//$("#add").click(function(){
$(document).ready(function(){

    //  alert("ff");
    var newrow=$('#services .headings').clone().removeClass('headings');
    for(var k=0;k<i.length;k++)

    {
        var disp = {

            names: i[k],
            checks: i[k]

        } 
        func.call(row,disp);
    }

    func(newrow,disp)
    .insertAfter('#services tr.headings')
    .show();
});

function func(row,disp)
{     
    row.find('.servicenames').text(disp.names);
    row.find('.servicecheck').data('href',disp.checks);

    return row;  
}

$("#services").on("click", ".servicecheck",function(){     
    alert($(this).data('href')); 
});

html

        <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
        <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<table id="services">
                  <tr class="headings"  style="display:none">
                      <td><span class="servicenames"> service names here</span></td>
                      <td><span class="servicecheck" data-href=""><input type="checkbox" id="servicecheck" name="servicecheck"> </td>
                  </tr>

              </table>

Answer 1

在你的 jsfiddle 你有下一个代码

....
var newrow=$('#services .headings').clone().removeClass('headings');
for(var k=0;k<i.length;k++)
{
    var disp = {
        names: i[k],
        checks: i[k]
    } 
}

func(newrow,disp).insertAfter('#services tr.headings').show();

....

function func(row,disp)
{

    row.find('.servicenames').text(disp.names);

    row.find('.servicecheck').data('href',disp.checks);

    i+=1;//this you try change global array, this string need remove
    return row;  

}

在for 循环内你只有声明disp，所以你只调用一次func，你也一次创建新行。为了解决这个问题，你必须像这样改变你的代码

....
for(var k=0;k<i.length;k++)
{
    var newrow=$('#services .headings').clone().removeClass('headings');
    var disp = {
        names: i[k],
        checks: i[k]
    } 
    func(newrow,disp).insertAfter('#services tr.headings').show();
}

....

function func(row,disp)
{

    row.find('.servicenames').text(disp.names);
    row.find('.servicecheck').data('href',disp.checks);

    return row;  

}

Answer 2

试试这个，

var i=[10,20,30,40,50,60,70]; 

//$("#add").click(function(){
$(document).ready(function(){

//  alert("ff");
var newrow=$('#services .headings').clone().removeClass('headings').css("display","block");
for(var k=0;k<i.length;k++)

{
  var disp = {

  names: i[k],
  checks: i[k]

} 

  $('#services tbody').append(func(newrow,disp).html());

}



});


   function func(row,disp)
    {

    row.find('.servicenames').text(disp.names);

    row.find('.servicecheck').data('href',disp.checks);

    return row;  

    }


$("#services").on("click", ".servicecheck",function(){     
    alert($(this).data('href')); 
});

Fiddle

希望对你有帮助