我怎样才能在jquery中正确地附加它

问题描述 投票：0回答：3

我有这个代码，我在一个div中附加一个id为“printWayBill”的div。每行从循环内的变量中获取其值。但我的问题是这个代码没有追加表中的所有tr和td。如何正确选择表元素中div内的最后一个元素，以便我可以正确地附加所有tr和td？

看看这个截图：http://prntscr.com/mxnk9m

我希望有人可以帮助我。谢谢！

var j=1;
        $('#table_1').find('tr').each(function (i, el) {
        var $tds = $(this).find('td');
    if (i > 2) {

        var lfrom = $tds.eq(5).text();
        var lfaddress = "address address address";
        var lfcontactno = "0000000";
        var lto = $tds.eq(10).text();
        var ltaddress = $tds.eq(16).text();
        var lbrgy = $tds.eq(17).text();
        var lcity = $tds.eq(18).text();
        var lprovince = $tds.eq(19).text();
        var ltcontactno = $tds.eq(21).text();
        var lproduct = $tds.eq(11).text();
        var lprice = $tds.eq(15).text();

        var ntable_o= "<table id='printWayBillTable" + j + "'"  +  " style='width: 540px; display: none; float: left; border-collapse: collapse;' border='1'><tbody>";
         var tfrom= "<tr><td style='width: 140px; font-size:14px;' >FROM:</td><td style='width: 400px; font-size: 14px;'>" + lfrom "</td></tr>";
         var tfaddress= "<tr><td style='width: 140px; font-size:14px;'>ADDRESS:</td><td style='width: 400px; font-size: 14px;'>" + lfaddress + "</td></tr>";
         var tfcontactno= "<tr><td style='width: 140px; font-size:14px;'>CONTACT NO:</td><td style='width: 400px; font-size: 14px;'>" + lfcontactno + "</td> </tr>";
         var note= "<tr style='border: none; height: 20px;'> <td style='border: none; text-align: center; height: 20px; font-size: 18px; padding-top:10px; padding-bottom:10px;' colspan='2'><strong>NOTE HERE</strong></td> </tr>";
         var tto= "<tr><td style='width: 140px; font-size:14px;'>TO:</td> <td style='width: 400px; font-size: 14px;'>" + lto + "</td> </tr>";
         var ttaddress= "<tr><td style='width: 140px; font-size:14px;'>ADDRESS:</td> <td style='width: 400px; font-size: 14px;'>" + ltaddress +  "<td> </tr>";
         var tbrgy= "<tr><td style='width: 140px; font-size:14px;'>BARANGAY:</td><td style='width: 400px; font-size: 14px;'>" + lbrgy + "</td></tr>";
         var tcity= "<tr><td style='width: 140px; font-size:14px;'>CITY &amp; PROVINCE:</td> <td style='width: 400px; font-size: 14px;'>" + lcity + "," + lprovince + "</td></tr>";
         var ttcontactno = "<tr><td style='width: 140px; font-size:14px;'>CONTACT NO:</td><td style='width: 400px; font-size: 14px;'>" + ltcontactno + "</td></tr>";
         var tproduct= "<tr class='page-break'><td style='width: 140px; font-size:14px;'>PRODUCT &amp; PRICE</td><td style='width: 400px; font-size: 14px;'>" + lproduct + "-" + lprice + "</td></tr>";             
        var ntable_c= "</tbody></table>";

        $("#printWayBill").append(ntable_o);
        $("#printWayBill").append(tfrom);
        $("#printWayBill").append(tfaddress);
        $("#printWayBill").append(tfcontactno);
        $("#printWayBill").append(note);
        $("#printWayBill").append(tto);
        $("#printWayBill").append(ttaddress);
        $("#printWayBill").append(tbrgy);
        $("#printWayBill").append(tcity);
        $("#printWayBill").append(ttcontactno);
        $("#printWayBill").append(tproduct);
        $("#printWayBill").append(ntable_c);

        ++j;
    }

    });
jquery
3个回答
0
投票

只使用一个append并连接所有变量：

$("#printWayBill").append(ntable_o+tfrom+tfaddress+tfcontactno+note+tto+ttaddress+tbrgy+tcity+ttcontactno+tproduct+ntable_c);
0
投票

您的代码中只有一个小问题。如果（i> 2），你添加了一个条件。它将跳过前3行。因为我索引**每个（函数（i，el）**函数返回从0开始的索引。所以你应该改变你的条件。

因为你正在查询TR，它将返回你表的所有tr。无论是标题TR还是正文TR

-1
投票

从截图中可以清楚地看到tr附加在表“PrintWayBillTable1”之外。

您可以执行以下操作：

var ntable_o= "<table id='printWayBillTable" + j + "'"  +  " style='width: 540px; display: none; float: left; border-collapse: collapse;' border='1'><tbody>";
ntable_o += "<tr><td style='width: 140px; font-size:14px;' >FROM:</td><td style='width: 400px; font-size: 14px;'>" + lfrom "</td></tr>";
ntable_o += "<tr><td style='width: 140px; font-size:14px;'>ADDRESS:</td><td style='width: 400px; font-size: 14px;'>" + lfaddress + "</td></tr>";
ntable_o += "<tr><td style='width: 140px; font-size:14px;'>CONTACT NO:</td><td style='width: 400px; font-size: 14px;'>" + lfcontactno + "</td> </tr>";
ntable_o += "<tr style='border: none; height: 20px;'> <td style='border: none; text-align: center; height: 20px; font-size: 18px; padding-top:10px; padding-bottom:10px;' colspan='2'><strong>NOTE HERE</strong></td> </tr>";
ntable_o += "<tr><td style='width: 140px; font-size:14px;'>TO:</td> <td style='width: 400px; font-size: 14px;'>" + lto + "</td> </tr>";
ntable_o += "<tr><td style='width: 140px; font-size:14px;'>ADDRESS:</td> <td style='width: 400px; font-size: 14px;'>" + ltaddress +  "<td> </tr>";
ntable_o += "<tr><td style='width: 140px; font-size:14px;'>BARANGAY:</td><td style='width: 400px; font-size: 14px;'>" + lbrgy + "</td></tr>";
ntable_o += "<tr><td style='width: 140px; font-size:14px;'>CITY &amp; PROVINCE:</td> <td style='width: 400px; font-size: 14px;'>" + lcity + "," + lprovince + "</td></tr>";
ntable_o += "<tr><td style='width: 140px; font-size:14px;'>CONTACT NO:</td><td style='width: 400px; font-size: 14px;'>" + ltcontactno + "</td></tr>";
ntable_o += "<tr class='page-break'><td style='width: 140px; font-size:14px;'>PRODUCT &amp; PRICE</td><td style='width: 400px; font-size: 14px;'>" + lproduct + "-" + lprice + "</td></tr>";             
ntable_o += "</tbody></table>";
$("#printWayBill").append(ntable_o);

我认为ntable_o，意味着单个名称就足够了，而不是单独的名称。

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.