2013-03-08 126 views
0

我正在使用下面的代碼,通過單擊按鈕添加表格行,現在我需要另一個按鈕來刪除新創建的行。請幫助我做到這一點。謝謝刪除添加的html表格行

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js">  </script> 

<script> 
jQuery(function(){ 
var counter = 1; 
jQuery('input.add_row').click(function(event){ 
    event.preventDefault(); 
    counter++; 
    var newRow = jQuery('<tr><td><select name="level' + counter + '"><option value="Matric or equivalent">Matric or equivalent</option><option value="10+2 or equivalent">10+2 or equivalent</option><option value="Diploma after matric">Diploma after matric</option><option value="Bachelor Degree">Bachelor Degree</option><option value="Master Degree">Master Degree</option><option value="Others">Others</option></select></td><td><input type="text" name="prog' + 
     counter + '"/></td><td><input type="text" name="ins' + 
     counter + '"/></td><td><input type="text" name="univ' + 
     counter + '"/></td><td><input type="text" name="reg' + 
     counter + '"/></td><td><input type="text" name="yr' + 
     counter + '" size="4" maxlength="4"/></td><td><input type="text" name="mar' + 
     counter + '"/></td><td><input type="text" name="sub' + 
     counter + '" size="8"/></td></tr>'); 
    jQuery('table.aca_inf').append(newRow); 
}); 
}); 
</script> 

回答

2

嘗試:

jQuery('input.del_row').click(function(event){ 
    event.preventDefault(); 
    jQuery('table.aca_inf tr:last').remove(); 

}); 
+0

A.V謝謝。作品不錯.. !! – MEP 2013-03-08 09:21:07

+0

歡迎..也可以通過'counter - '遞減計數器,但是當刪除一個並添加另一個時會創建重複項... – Anujith 2013-03-08 09:24:24

+0

幫助我...使用javascript新創建的行的驗證不起作用: ( – MEP 2013-03-08 12:08:13

1

使用:

function delete_row(){ 
    //delete last row of table 
    while(counter){ 
    $('#btn').on("click", function(){ 
      $('#tab1 tr:last').remove(); 
      counter--; 
    }); 
    } 
    } 
+0

感謝您的努力..! – MEP 2013-03-08 09:24:38