Question

作为another question的后续行动，请考虑以下代码：

<body>
<script>

    function addAttendee() {
        $('.newAttendee').first().clone().appendTo('.attendees');
    }

</script>

<form action="test2.php" name="testform" method="post">
    <span class="attendees">
    <input type="text" name="attendee[0][city]" value="city 1">
    <input type="text" name="attendee[0][state]" value="state 1">
    <input type="text" name="attendee[0][zip]" value="zip 1">
    </span>
<a href="#" name="addAttendee" onclick="addAttendee()">Add Attendee</a>
<br>
<input type="submit" onclick="getOutput()">
</form>

<div class="hideThis" style="display: none;">
    <span class="newAttendee">
        <br>
    <input type="text" name="attendee[1][city]" value="city 2">
    <input type="text" name="attendee[1][state]" value="state 2">
    <input type="text" name="attendee[1][zip]" value="zip 2">
    </span>
</div>

</body>

当我点击＆＃34;添加参加者＆＃34;时，我想将添加的部分的数组编号更改为下一个更高的值。

即：

name="attendee[1][xxxxx]

需要成为

name="attendee[2][xxxxx]

想知道是否有人对此有任何捷径？

提前再次感谢。

Answer 1

在数组名称中不指定索引值会更简单：

例如更改：

<input type="text" name="attendee[1][city]" value="city 2">

要

<input type="text" name="attendee[][city]" value="city 2">

此外，由于您要克隆现有的，您应该重置克隆中的值

function addAttendee() {
    var $clone = $('.newAttendee').first().clone();
    $clone.find('input').val('');
    $('.attendees').append($clone);       
}

Answer 2

以下是适用于我想要做的解决方案：

<body>
<script>

    $(document).ready( function() {
    });

    $attendeeValue = 1;

    function addAttendee() {
        var $newAttendee = $('.newAttendee').html();
        $newAttendee = $newAttendee.replace(/xxx/g,$attendeeValue++);
        console.log($newAttendee);
        $('.attendees').append($newAttendee);
        //$('.newAttendee').first().clone().appendTo('.attendees');

    }

</script>

<form action="test2.php" name="testform" method="post">
    <span class="attendees">
    <input type="text" name="attendee[0][city]" value="city 1">
    <input type="text" name="attendee[0][state]" value="state 1">
    <input type="text" name="attendee[0][zip]" value="zip 1">
    </span>
<a href="#" name="addAttendee" onclick="addAttendee()">Add Attendee</a>
<br>
<input type="submit" onclick="getOutput()">
</form>

<div class="hideThis" style="display: none;">
    <span class="newAttendee">
        <br>
    <input type="text" name="attendee[xxx][city]">
    <input type="text" name="attendee[xxx][state]">
    <input type="text" name="attendee[xxx][zip]">
    </span>
</div>

</body>

我希望这对其他人有用。

感谢所有人的投入。

如何更改输入的单个部分＆＃34; name＆＃34;使用JQuery / Javascript？

2 个答案: