Question

我输入了文字和按钮。在输入内输入一个值并按下按钮后，内容将在div中打印。 HTML代码看起来像这样

    <div id="content">
        <input type="text" value="" class="input-value" />
        <button type="button" id="push" onclick="appendInput()";>push me</button>
        <div id="todo"></div>
    </div>

并且将输入值附加到某个div的函数如下所示

        function appendInput() {
            $('#todo').append($('.input-value').val());
        }

来自输入的内容已发送，但它只是在现有值之后继续添加。如果我输入 lorem 并点击按钮，然后我再次输入 ipsum 并再次按下该按钮，结果为

    <div id="todo">loremipsum</div>

这让我想到了我无法管理的问题。单击该按钮时，该值会在#todo div内连续添加。如何从div标签之间的输入发送每个发送的值？为了得到像这样的结果

    <div id="todo">
        <div>lorem</div>
        <div>ipsum</div>
    </div>

Answer 1

将您的功能更改为此...

function appendInput() {
    $('#todo').append('<div>' + $('.input-value').val() + '</div>');
}

这将自动添加div中包含的每个值。

如何在div标签之间添加输入值到内容 - jQuery

1 个答案: