在第 n 个位置添加新列 Javascript答案

【问题标题】：Add new column at nth position Javascript在第 n 个位置添加新列 Javascript
【发布时间】：2016-05-23 11:35:55
【问题描述】：

我正在尝试在第 n 个位置动态添加一个新列。目前，请在我的代码下方找到。

var name = window.prompt("Please enter the Column Name you intend to Add", "");
var name2 = window.prompt("Please enter the Column Location you intend to Add", "");
if (name == null || name.trim() == "" || name == "0") {
    alert('Invalid Column Number');
}
else if (name2 == null || name2.trim() == "" || name2 == "0") {
    alert('Invalid Column Number');
}
else {
    var name1 = parseInt(name2);
    $('td:nth-child(' + name1 + ')').append($("<td>"));
    $('th:nth-child(' + name1 + ')').html(name).css("font-weight", "Bold");     
}

HTML 标记

<div class="table-responsive" style="margin-top:10px;">
              <table class="table table-striped table-bordered table-hover" id="myTable">
                 <thead>
                    <tr>
                       <th>Sl No</th>
                       <th>Item Id</th>
                       <th>Item Description</th>
                       <th>Quantity</th>
                    </tr>
                 </thead>
                 <tbody>
                    <tr id="mainid">
                       <td><input type="text"/></td>
                       <td><input type="text"/></td>
                       <td><input type="text"/></td>
                       <td><input type="text"/></td>
                    </tr>
                 </tbody>
              </table>
           </div>

我能够成功添加新列，但这是替换现有列。我需要的是附加到索引编号列，但是，它取代它。任何人都可以指导解决这个问题。

【问题讨论】：

你可以发布标记吗？
添加标记伙伴！
name1 传递了什么值？
name 有列名，name2 有列索引

标签： javascript html datatable multiple-columns

【解决方案1】：

将before 插入您在索引中找到的td，而不是附加

 $('td:nth-child(' + name1 + ')').insertBefore($("<td>"));

您正在附加 td，这实际上会将 td 添加为找到的 td 的子级而不是兄弟级

还有一个建议

我也认为你也应该运行这一行来为你的新列添加标题

$('th:nth-child(' + name1 + ')').insertBefore($("<th>"));

【讨论】：