0

タイプテキストとボタンの入力があります。入力内に値を入力してボタンを押すと、内容が 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>
4

1 に答える 1

2

関数をこれに変更します...

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

これにより、div でラップされた各値が自動的に追加されます。

于 2013-10-08T14:11:09.500 に答える