【问题标题】:javascript - create array with foreach loop through tablejavascript - 使用foreach循环通过表创建数组
【发布时间】:2014-04-20 14:30:13
【问题描述】:

我有一个这样的表格:

<table id="preview">
<tbody>
<tr>
<td>01/01/2010</td>
<td>Credit</td>
<td>1000</td>
</tr>
<tr>
<td>01/05/2010</td>
<td>Debit</td>
<td>200</td>
</tr>
<tr>
<td>01/09/2010</td>
<td>Debit</td>
<td>400</td>
</tr>
<tr>
<td>01/11/2010</td>
<td>Debit</td>
<td>100</td>
</tr>
</tbody>
</table>

现在我需要创建一个数组来发送(ajax/php),如下所示:

$ajaxArray = array(   0 => array(From   => "01/01/2010",  //1st td of the 1st Row
                                    To     => "01/05/2010",  //1st td of the 2nd Row
                                    Type   => "Credit",
                                    Amount => 1000.00),
                         1 => array(From   => "01/05/2010",  //1st td of the 2nd Row
                                    To     => "01/09/2010",  //1st td of the 3th Row
                                    Type   => "Debit",
                                    Amount => 200.00),
                         2 => array(From   => "01/09/2010",  //1st td of the 3th Row
                                    To     => "01/11/2010",  //1st td of the 4th Row
                                    Type   => "Debit",
                                    Amount => 400.00),
                         3 => array(From   => "01/11/2010",  //1st td of the 4th Row
                                    To     => "01/01/2012",  //Value in $last_date var
                                    Type   => "Debit",
                                    Amount => 100.00)
        );

我尝试使用此代码:

 $('#preview > tbody  > tr').each(function() {
            var from = $('td:eq(0) ', this).text();
            var type = $('td:eq(1) ', this).text();
            var amount = $('td:eq(2) ', this).text();
            ajaxArray.push({
                From: from,
                Type: type,
                Amount: amount
            });
        });

如您所见,我无法获得“至”日期值。 “To”日期值是下一行的第一个 TD 中包含的日期,最后一行除外,其中该值位于 $last_date 变量中。

提前致谢

【问题讨论】:

    标签: javascript jquery arrays foreach


    【解决方案1】:

    应该这样做Fiddle Demo

    var array = [];
    var rows  = $("#preview tbody tr");
    
    $.each( rows, function(index, row) {   
        var columns = $(row).find("td");
        
        array[index] = {};             
        array[index].from = columns[0].innerHTML;    
        array[index].type = columns[1].innerHTML;
        array[index].amount = columns[2].innerHTML;
        
        if(index > 0){
            array[index - 1].to = columns[0].innerHTML;
        }      
    });
        
    $("#result").text(JSON.stringify(array));
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <table id="preview">
    <tbody>
    <tr>
    <td>01/01/2010</td>
    <td>Credit</td>
    <td>1000</td>
    </tr>
    <tr>
    <td>01/05/2010</td>
    <td>Debit</td>
    <td>200</td>
    </tr>
    <tr>
    <td>01/09/2010</td>
    <td>Debit</td>
    <td>400</td>
    </tr>
    <tr>
    <td>01/11/2010</td>
    <td>Debit</td>
    <td>100</td>
    </tr>
    </tbody>
    </table>
    
    <hr/>
        
    <pre id="result"></pre>

    【讨论】:

    • 非常感谢。除最后一个数组外,此代码对每一行都有效。如何从 $last_date 变量中获取最后一个 To 日期?
    • 这个我不知道,没有php经验抱歉。
    • 好的,没问题。我可以通过添加一个带有最后一个“To”日期的隐藏行来解决。
    • @kritzikrarzi.. 你说得对,它更优雅 ;) 谢谢
    猜你喜欢
    • 2018-06-12
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-06-16
    • 1970-01-01
    • 2016-09-17
    • 1970-01-01
    相关资源
    最近更新 更多