簡體   English   中英

如何在單個對象中並排獲得表格行?

[英]How to get side by side table row in single objects?

當我在表中輸入數據並保存它返回第一個表的數據時,我並排有表

[{"circuit_no_left":"1","rating_left":"3","description_left":"test1","circuit_no_right":"2","rating_right":"5","description_right":"test2"},{"circuit_no_left":"3","rating_left":"","description_left":"","circuit_no_right":"4","rating_right":"","description_right":""},{"circuit_no_left":"5","rating_left":"","description_left":"","circuit_no_right":"6","rating_right":"","description_right":""},{"circuit_no_left":"7","rating_left":"","description_left":"","circuit_no_right":"8","rating_right":"","description_right":""}]

我想要這樣的輸出

[{"circuit_no_left":"1","rating_left":"3","description_left":"test1"},{"circuit_no_right":"2","rating_right":"5","description_right":"test2"},{"circuit_no_left":"3","rating_left":"","description_left":""},{"circuit_no_right":"4","rating_right":"","description_right":""},{"circuit_no_left":"5","rating_left":"","description_left":""},{"circuit_no_right":"6","rating_right":"","description_right":""},{"circuit_no_left":"7","rating_left":"","description_left":""},{"circuit_no_right":"8","rating_right":"","description_right":""}]

我只想要一個對象中的一個表格行。 我在一個不正確的對象中並排放置桌子。 一個對象中的左側列和另一對象中的右側列。

html:

    <div class="table-responsive">
                            <table id="table" class="table table-bordered custom_table">
                                <thead>
                                <tr>
                                    <th style="width: 72px;">Circuit</th>
                                    <th style="width: 72px;">Rating</th>
                                    <th>Description</th>
                                    <th style="width: 72px;">Circuit</th>
                                    <th style="width: 72px;">Rating</th>
                                    <th>Description</th>
                                </tr>
                                </thead>
                                <tbody>

                                </tbody>
                            </table>
                        </div>

腳本:

  var table = document.getElementById('table');
                var jsonArr = [];
                for (var i = 1, row; row = table.rows[i]; i++) {
                    var col = row.cells;
                    var jsonObj = {
                         circuit_no_left: col[0].innerHTML,
                        rating_left: col[1].innerHTML,
                        description_left: col[2].innerHTML,
                        circuit_no_right: col[3].innerHTML,
                        rating_right: col[4].innerHTML,
                        description_right: col[5].innerHTML,
                    }

                    jsonArr.push(jsonObj);
                }
                this.table_data = JSON.stringify(jsonArr);

                console.log('tableData', this.table_data);

如果您希望將左右條目分解為單獨的對象,只需在循環中創建兩個對象並將它們分別推送到數組中。

var jsonArr = [];
for (var i = 1, row; row = table.rows[i]; i++) {
    var col = row.cells;
    var jsonObjLeft = {
        circuit_no_left: col[0].innerHTML,
        rating_left: col[1].innerHTML,
        description_left: col[2].innerHTML
    };
    var jsonObjRight = {
        circuit_no_right: col[3].innerHTML,
        rating_right: col[4].innerHTML,
        description_right: col[5].innerHTML
    };

    jsonArr.push(jsonObjLeft);
    jsonArr.push(jsonObjRight);
}
this.table_data = JSON.stringify(jsonArr);

console.log('tableData', this.table_data);

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM