Question

我有这段代码，我在一个循环内将表附加在一个具有“ printWayBill”标识的div内。每行都从循环内的变量获取其值。但是我的问题是这段代码没有在表中附加所有tr和td。我如何正确地选择table元素内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;
    }

    });

Answer 1

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

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

Answer 2

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

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

Answer 3

从屏幕截图中可以明显看出， 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 意味着单个名称就足够了，而不是单独的名称。

我如何正确地将此附加到jQuery中

3 个答案: