Question

Ich versuche, eine dynamische Zeile in eine Tabelle einzufügen. Anscheinend konnte ich Eingabezeilen hinzufügen, aber ich kann keine neue Zeile für die Schaltfläche <td class="text-center"><a class='btn btn-info btn-xs' href="#"><span class="glyphicon glyphicon-edit"></span> Select</a> </td> hinzufügen. Es gibt einen Fehler von Uncaught SyntaxError: missing) after argument list

<table id="tab_logic" class="table table-bordered table-striped display nowrap" cellspacing="3" width="100%"> 
    <br> 
    <thead> 
     tr> 
     <th>Name</th> 
     <th>Action</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr id='addr0'> 
     <td>1 
     </td> 
     <td class="text-center"><a class='btn btn-info btn-xs' href="#"><span class="glyphicon glyphicon-edit"></span> Select</a> </td> 
     </tr> 
     <tr id='addr1'></tr> 
    </tbody> 
    <tfoot> 
    </tfoot> 
</table> 

Javascript

<script type="text/javascript"> 
$(document).ready(function(){ 
    var i=1; 
    $("#add_row").click(function(){ 
     $('#addr'+i).html("<td>"+ (i+1) +"</td><td><input name='name"+i+"' type='text' placeholder='Name' class='form-control input-md' /> </td> <td class="text-center"><a class='btn btn-info btn-xs' href="#"><span class="glyphicon glyphicon-edit"></span> Select</a> </td>"); 
     $('#tab_logic').append('<tr id="addr'+(i+1)+'"></tr>'); 
     i++; 
    }); 
}); 
</script> 

Answer 1

Verwendung dieses, Sie "statt‘ setzen ... und in HTML-Check Zeile <tr> aber zeigt tr>

var i=1; 
    $("#add_row").click(function(){ 
     $('#addr'+i).html("<td>"+ (i+1) +"</td><td><input name='name"+i+"' type='text' placeholder='Name' class='form-control input-md' /> </td> <td class='text-center'><a class='btn btn-info btn-xs' ><span class='glyphicon glyphicon-edit'></span> Select</a> </td>"); 
     $('#tab_logic').append('<tr id="addr'+(i+1)+'"></tr>'); 
     i++; 
    }); 

Answer 2

Versuchen Sie, Ihre " und ' sauber zu halten.Sie haben eine Menge von ihnen durcheinander

var i = 1; 
 
$('#add_row').click(
 
    function(){ 
 
    $('#addr'+i).html('<td>' + (i+1) + '</td><td class="text-center"><a class="btn btn-info btn-xs" href="#"><span class="glyphicon glyphicon-edit"></span>Select</a></td>'); 
 
    $('#tab_logic').append('<tr id="addr'+(i+1)+'"></tr>'); 
 
    i++; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table id="tab_logic" class="table table-bordered table-striped display nowrap" cellspacing="3" width="100%"> 
 
<thead> 
 
<tr> 
 
<th>Name</th> 
 
<th>Action</th> 
 
</tr> 
 
</thead> 
 
<tbody> 
 
<tr id='addr0'> 
 
<td>1 
 
</td>    
 
<td class="text-center"><a class="btn btn-info btn-xs" href="#"><span class="glyphicon glyphicon-edit"></span> Select</a> </td>  
 
    </tr> 
 
    <tr id="addr1"></tr>       
 
    </tbody>   
 
    <tfoot> 
 
    </tfoot> 
 
    </table> 
 
    
 
    <button id="add_row">Add Row</button>