Question

我正在对我之前的问题进行一些跟进。我只是陷入了另一种逻辑。我有一个text input field和两个按钮。 Add和Undo。当我点击add时，input的值会附加到textarea和另一个text input field，我将稍后将其隐藏。

现在我正在尝试实现undo按钮，但到目前为止，我只能找到一个简单的解决方案来撤消字段的最后一个增量。我想知道是否还有任何简单的方法来撤消任何数量的增量。我想最好的做法是删除,中text input和/n textarea中<div class="test1"> <input type="text" class="reset actor_input" name="actor" value="add actors"></input> <input type="text" name="actors"></input> <div class="found_actors"></div> <div id="add" class="button_content">ADD</div> <div id="undo" class="button_content">UNDO</div> <div class="actors_list"><textarea readonly style="resize: none;" rows="20" cols="20" name="actors-list"></textarea></div> </div>的下一次出现的所有字符，但我不会＃ 39;甚至认为这是可能的。

here是JSFIDDLE的当前工作版本，代码如下。期待您的建议。谢谢。

HTML

var textarea_before = null;
var input_before = null;

    $("#add").click(function() {
        textarea_before = $("[name='actors-list']").val();
        input_before = $("[name='actors']").val();
        $("[name='actors-list']").append($("[name='actor']").val()+'&#13;&#10;');
        $("[name='actors']").val($("[name='actors']").val() + $("[name='actor']").val()+', ');
    });

    $("#undo").click(function() {

        $("[name='actors-list']").empty().append(textarea_before);
        $("[name='actors']").val(input_before);
    });

脚本

{{1}}

Answer 1

您可以将所有新演员存储在数组中，然后更新输入字段和textarea，如this

var items = [];

$("#add").click(function() {
    // Push the new actor in the array
    items.push($("[name='actor']").val());
    populate();
});

$("#undo").click(function() {
    if (items.length > 0) {
        // remove last element of the array
        items.splice(-1,1);
        populate();
    }
});

populate = function() {
    $("[name='actors-list']").text('');
    $("[name='actors-list']").append(items.join('&#13;&#10;'));
    $("[name='actors']").val(items.join(','));   
}

如何撤消对textarea和文本输入字段的更改

1 个答案: