javascript - 重命名动态添加或删除的表单域

Question

我正在寻求帮助以重命名一些动态创建的字段的名称属性。现在，我的代码为添加的字段分配了新值(它根据 div 的长度递增)但是当我删除一个字段时出现问题，我不知道如何根据删除的字段数重命名剩余的字段。

jQuery:

$(document).ready(function () {
    $("#add").click(function () {
        var intId = $("#reglas div").length;
        var fieldWrapper = $('<div></div>', {
            class: 'fieldwrapper',
            id: 'field' + intId
        });
        var fPath = $('<input align="left" type="text" placeholder="Path" class="reglas_wrapper" id="path" name="field1_' + intId + '" required /> ');
        var fTTL = $('<input type="text" class="reglas_wrapper" placeholder="TTL" id="ttl" name="field2_' + intId + '" required />');
        var removeButton = $('<input align="right" type="button" id="del" class="remove" value="-" /> <br><br>');
        removeButton.click(function () {
            $(this).parent().remove();
        });
        fieldWrapper.append(fPath);
        fieldWrapper.append(fTTL);
        fieldWrapper.append(removeButton);
        $("#reglas").append(fieldWrapper);

    });
    $("#cache").each(function () {
        $(this).qtip({
            content: {
                text: $(this).next('.tooltiptext')
            }
        });
    });

});
$('#formsite').on('submit', function (e) {
    //prevent the default submithandling
    e.preventDefault();
    //send the data of 'this' (the matched form) to yourURL
    $.post('siteform.php', $(this).serialize());
});

这是我的完整代码:http://jsfiddle.net/34rYv/131/

Answer 1

你需要一个增量器。看看这个 updated fiddle .

这是代码的开头:

$(document).ready(function() {
    var myIncr = 0;
    $("#add").click(function() {
        myIncr++;
        var intId = myIncr;