Einfügen von Zeilen in eine Tabelle mit Texteingaben

Question

Ich versuche, Zeilen in einer regulären HTML-Tabelle einzufügen.

Jede Zeile hat ein <input type="text"> Element.

Aber jedes Mal, wenn ich eine neue Zeile über JavaScript hinzufüge, verschwinden die Daten oder Werte auf dem bereits vorhandenen <inputs>.

Hier ist der Code:

<table id="tableSeriales" summary="Seriales" class="servicesT" cellspacing="0" style="width: 100%"> 
    <tr> 
     <td class="servHd">Seriales</td> 
    </tr> 
    <tr> 
    <td class="servBodL"> 
      <input id="0" type="text" value="" style="color: blue; width: 100%"/> 
     </td> 
    </tr> 
</table> 
<a href="javascript:addRow()">Add row</a> 

Und sieht das JavaScript wie:

function addRow() { 
     var rowCount = $('#tableSeriales tr').length; 
     $("#tableSeriales").html(
       $("#tableSeriales").html() + 
       '<tr><td class="servBodL"><input id="' + (rowCount +1) + '"type="text" value="" style="color: blue; width: 100%" onkeypress="return handleKeyPress(event,this.form)"/></td></tr>' 
      ); 
    } 

Answer 1

$('html code goes here').appendTo('#tableSeriales');

oder $('#tableSeriales').append('html code goes here'); verwenden