Question

我有一个要求，我必须在表单中添加现有字段集的副本。我能够成功实现克隆过程。但是我无法更改fieldsset元素的名称和id。它与第一个字段集相同，但我希望它使用不同的名称和id来区分它（即使在最后添加一个数字也没关系）。下面是我的js和fieldset。

<div id="placeholder">
<div id="template">
<fieldset id="fieldset">
<legend id="legend">Professional development</legend>
<p>Item                     <input type ="text" size="25"   name="prof_itemDYNID" id ="prof_item_id"/><br /></p>
<p>Duration                 <input type ="text" size="25"   name="prof_durationDYNID"  id="prof_duration_id" /><br /></p>
<p>Enlargement              <label for="enlargement"></label><p></p>
                            <textarea name="textareaDYNID" cols="71" rows="5" id="prof_enlargement">
</textarea></p>
<p><input type="button" value="Add new item" id="add_prof"  onclick="Add();" /></p>
</fieldset>
</div>
</div>

function Add() {

    var oClone = document.getElementById("template").cloneNode(true);
    document.getElementById("placeholder").appendChild(oClone);
}

此外，这只是一个示例字段集，它也会有所不同。我听说这可以使用正则表达式完成，但不知道如何做到这一点。请帮忙。

Answer 1

不确定这可以使用正则表达式实现，但有些代码应该可以工作...

var copyNode = original.cloneNode(true);
copyNode.setAttribute("id", modify(original.getAttribute("id")));
document.body.appendChild(el);

Answer 2

最好（根据我的假设）回答上述问题。

function addMe(a){

    var original = a.parentNode;

        while (original.nodeName.toLowerCase() != 'fieldset')
    {
        original = original.parentNode;
    }
    var duplicate = original.cloneNode(true);

   var changeID= duplicate.id;

   var counter = parseInt(changeID.charAt(changeID.length-1));
     ++counter;
   var afterchangeID = changeID.substring(0,changeID.length-1);
    var newID=afterchangeID + counter;
    duplicate.id = newID;
    var tagNames = ['label', 'input', 'select', 'textarea'];
        for (var i in tagNames)
        {

    var nameChange = duplicate.getElementsByTagName(tagNames[i]);

        for (var j = 0; j < nameChange.length; j++)
    {if (nameChange[j].type != 'hidden'){
        var elementName = nameChange[j].name;

                var afterSplitName = elementName.substring(0,elementName.length-1);

             nameChange[j].name = afterSplitName + counter;


        var elementId = nameChange[j].id;

                var afterSplitId = elementId.substring(0,elementId.length-1);

                    nameChange[j].id = afterSplitId + counter;


    }
        }
}

    insertAfter(duplicate, original);
}

function insertAfter(newElement, targetElement)
{
    var parent = targetElement.parentNode;
    if (parent.lastChild == targetElement)
    {
        parent.appendChild(newElement);
    }
    else
    {
        parent.insertBefore(newElement, targetElement.nextSibling);
    }
}

使用javascript克隆时更改fieldset元素的名称

2 个答案: