Neue Spalte an der n-ten Position hinzufügen Javascript

Question

Ich versuche dynamisch eine neue Spalte an der n-ten Position hinzuzufügen. Derzeit finden Sie unten meinen Code.

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 Mark-Up

<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> 

ich in der Lage bin, um erfolgreich die neuen Spalt hinzufügen, aber diese die bestehenden ersetzt. Was ich brauche, ist an die indexnummerierte Spalte anzuhängen, aber sie zu ersetzen. Kann mir jemand bitte helfen, dies zu lösen.

Answer 1

Legen Sie es before die td Sie auf Index gefunden, hängen nicht

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

Sie sind die td anhängt, welche tatsächlich die td als Kind gefunden td hinzufügen und nicht als Geschwister

One Vorschlag auch

Ich denke auch, dass Sie diese Zeile auch ausführen sollten, um t hinzuzufügen er Header für Ihre neue Spalte

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