jquery - 增量添加新行

Question

如何增加我的新行以从现有数字继续？

演示

$('.add-button').click( function() {
//var $current_num = $("table#myTable tbody tr td").length;
    var $this = $("table#myTable tbody tr");
    var $current_num = $this.find("td:first").attr("rowspan").length;
    var $incremented = $this.find('td.increment').val(parseInt($this.find('td.increment').val())+1);

     $("#myTable tbody").append("<tr><td rowspan='2'>" + $incremented + "</td><td>other data</td><td>even more data</td></tr><tr><td colspan='8'>test</td></tr>");
   return false;
});

Answer 1

Retrieve the increment value as follows and it should work:

var $this = $("table#myTable tbody");
var $incremented = $this.find('td[rowspan]:last').text()*1 + 1;

Updated your fiddle: http://jsfiddle.net/QYGpe/16/

Answer 2

使用.text()而不是.val()for<td>元素

$(function() {
    var $tbody = $("#myTable tbody");
    $('.add-button').click( function(e) {
        e.preventDefault();
        var lastId = parseInt($tbody.find("td[rowspan]:last").text()) + 1;
        $tbody.append("<tr><td rowspan='2'>" + lastId + "</td><td>other data</td><td>even more data</td></tr><tr><td colspan='8'>test</td></tr>");
    });
});

jsFiddle 代码

Answer 3

increment为您的 * TD * s 提供一个 css 类名称 ( )，它显示计数器编号并使用last()方法获取显示最后一个计数器编号的最后一个 TD，并获取其内容并递增，然后将其添加到新行中。

$(function(){
   $('.add-button').click( function(e) {   
    e.preventDefault();
    var $this = $("table#myTable tbody tr");
    var $current_num = $this.find("td:first").attr("rowspan").length;
    var $incremented =parseInt($("#myTable").find('td.increment').last()
                                                                     .html())+1;

     $("#myTable tbody").append("<tr><td rowspan='2'  class='increment'>" + 
               $incremented + "</td><td>other data</td>
               <td>even more data</td></tr><tr><td colspan='8'>test</td></tr>");

   });
 });

工作示例http://jsfiddle.net/QYGpe/14/

Answer 4

var length = $this.length;

var $incremented = (length/2)+1;

尝试这个。