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

时间:2014-03-11 05:45:36

标签: jquery html5

默认情况下,该表有2行。在小提琴的顶部,文本字段有一些价值。如果我更改文本字段中的值,将添加行数。我找到了以下脚本:

http://devzone.co.in/add-remove-rows-in-table-dynamically-using-jquery/

http://jsfiddle.net/toddhd/Qt7fH/

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

但我无法连接这两个脚本。任何一个帮助都可以得到赞赏。

3 个答案:

答案 0 :(得分:2)

试试这个。

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

Fiddle Demo

答案 1 :(得分:1)

$("#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/

答案 2 :(得分:0)

尝试以下代码

$("#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();
            }
       }
    });