Javascript 某种数组来创建多步表单？

这里有一位很好的成员帮助我创建了一个表单，它可以在执行过程中添加步骤。我对它做了一些修改，允许您通过单击“更改”按钮更改其中一些问题的答案。当然，我意识到了自己的局限性，只把它应用到第一个问题上，结果很糟糕。。。 我处理这个问题的方式是给每个问题和按钮一个唯一的id，我认为这可能是错误的处理方式

这就是我想要的，我部分完成了一些：

• 填写一个字段，然后按NEXT
• 字段1变为只读文本，并显示ChangeButton
• 下面会出现一个新字段，您可以填写该字段
• 按字段1上的“更改”，字段2变为不可编辑，而字段1现在可编辑。更改按钮也会变为“保存”。单击“保存”，可使字段2再次可编辑，字段1再次不可编辑
• 这将永远持续下去：）

我尝试了我在互联网上找到的东西，但我希望在这方面做得更好的人能帮我一点忙，如果可以的话：） 这是我的小提琴

谢谢大家!

下面是我如何完成你想做的事

HTML:

<div id="question1" class="question active">
    <label>Q1</label>
    <input type="text" />
    <input type="button" value="SAVE" class="button" />
</div>

var qa = []; // questions array of objects { text: "question text" }

$('.button').live('click', function(e) {
    var $but = $(this),
        $inp = $but.prev(),
        $parent = $but.parent(),
        i = $parent.attr('id').match(/\d+$/)[0] - 1,
        $new;

    if ($but.val() == 'SAVE') {

        // store value to array
        qa[i] = {
            text: $inp.val()
        };

        // append new question inputs if needed
        if (!$('#question' + (i + 2)).length) {
            $new = $parent.clone();
            $new.attr('id', 'question' + (i + 2));
            $new.find('label').html('Q' + (i + 2));
            $new.find('input[type="text"]').val('');
            $new.insertAfter($parent);
        }

        // change to inactive attributes
        $inp.attr('disabled', true);
        $parent.removeClass('active').addClass('answered');
        $but.val('CHANGE');

    } else { // CHANGE

        // change to active attributes
        $inp.attr('disabled', false);
        $parent.removeClass('answered').addClass('active');
        $but.val('SAVE');

    }
});

我使数组存储对象，以便在需要时可以轻松地为每个问题添加其他属性

---

谢谢！你是最好的先生：）