需要从javascript函数的数组输出

时间:2013-11-25 20:25:28

标签: javascript jquery ajax arrays

Chech this 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>

2 个答案:

答案 0 :(得分: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;  

}

答案 1 :(得分:0)

试试这个,

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

希望有所帮助