在JQuery中使用添加行/克隆来增加类 [英] Incrementing class with add row/clone in JQuery

问题描述

可能重复:

然后我有了一个按钮，它将最后一个表行并克隆到下面的行中，因此使用此Jquery添加了新行.

$("#add_row").click(function() {
        $('#staff tbody>tr:last').clone(true).insertAfter('#staff tbody>tr:last');
        return false;
    });

我需要做的是将RS_Staff_Title1变成RS_Staff_Title2，RS_Staff_Title3，以此类推-其他列也会发生同样的情况.

我该如何做到这一点?

解决方案

一种可能的解决方案:

$("#add_row").click(function() {
    var row = $("#staff tbody > tr:last"),
        newRow = row.clone(true);

    newRow.find("input").each(function() {
        var num = +(this.id.match(/\d+$/) || [0])[0] + 1;
        this.id = this.id.replace(/\d+$/, "") + num;
        this.name = this.id;
    });

    newRow.insertAfter(row);
    return false;
});

演示: http://jsfiddle.net/GHTN7/

Possible Duplicate:
How to use jQuery to add a new row to a table, and assgin an incrementing id to it

I've got some table rows as per below:

<td><input id="RS_Staff_Title1" name="RS_Staff_Title1" style="width:100%;"></td>

<td><input id="RS_No_WD_Staff1" name="RS_No_WD_Staff1" style="width:100%;"></td>

<td><input id="RS_No_Weekdays1" name="RS_No_Weekdays1" style="width:100%;"></td>

<td><input id="RS_No_WE_Staff1" name="RS_No_WE_Staff1" style="width:100%;"></td>

<td><input id="RS_No_WE_Days1" name="RS_No_WE_Days1" style="width:100%;"></td>

<td><img class="remove_row" src="assets/images/delete-icon.png"></td>

I've then got a button which takes the last table row and clones it to the one below, therefore adding a new line using this Jquery"

$("#add_row").click(function() {
        $('#staff tbody>tr:last').clone(true).insertAfter('#staff tbody>tr:last');
        return false;
    });

What I need to happen is for the RS_Staff_Title1 to become RS_Staff_Title2, RS_Staff_Title3 and so on - the same would happen for the other columns as well.

How can I go about acheiving this?

解决方案

One possible solution:

$("#add_row").click(function() {
    var row = $("#staff tbody > tr:last"),
        newRow = row.clone(true);

    newRow.find("input").each(function() {
        var num = +(this.id.match(/\d+$/) || [0])[0] + 1;
        this.id = this.id.replace(/\d+$/, "") + num;
        this.name = this.id;
    });

    newRow.insertAfter(row);
    return false;
});

DEMO: http://jsfiddle.net/GHTN7/

这篇关于在JQuery中使用添加行/克隆来增加类的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！