添加tr行取决于输入文本值的值

Question

默认情况下，表有2行。在顶部，文本字段有一些值。如果我更改文本字段中的值，则会添加行数。我找到了以下脚本:

http://devzone.co.in/add-remove-rows-in-table-dynamically-using-jquery/
http://jsfiddle.net/toddhd/Qt7fH/

这是我的小提琴:<http://jsfiddle.net/ZgKMU/>

但是我不能把这两个脚本连接起来。

Answer 1

试试这个

$("#myInputFieldId").on('change',function(){
    var items = $(this).val();
    for(var i=0; i<items; i++){
        $('#preq').find('tr').eq('1').clone().appendTo('#preq');
    };
 });

小提琴演示

Answer 2

$("#myInputFieldId").on("change",function(){ 
var norow= parseInt($("#myInputFieldId").val());
var trlenght=$("#preq tr").length-1;
if(norow>trlenght)
{
    for(var i=0;i<norow-trlenght;i++){
        var tr=$("#preq tr:eq(1)").clone();
        $("#preq tr:last").after(tr);}
}
else if(trlenght>norow)
{
    for(var i=0;i<trlenght-norow;i++){
        $("#preq tr:last").remove();}
}
})

演示链接http://jsfiddle.net/anandnat/ZgKMU/2/

Answer 3

试试下面的代码

$("#myInputFieldId").change(function(){ 
       var cnt=$(this).val();
       var totalTr=($("#preq tr").length)-1;
       if(cnt>totalTr){
           for(var i=0;i<cnt-totalTr;i++){
               var lastTR=$("#preq tr:last").html();
               $("#preq").append("<tr>");
               $("#preq tr:last").html(lastTR);
           }
       }
       else{
            for(var i=0;i<totalTr-cnt;i++){
                $("#preq tr:last").remove();
            }
       }
    });