0

3つの個別のテキストボックスがあり、ボックスから4番目のボックスにすべてのコンテンツをコピーするボタンが必要です。JavaScriptでこれを行うにはどうすればよいですか?

<form>
<textarea cols="60" rows="5" id="box1">PAST: </textarea>
<br /><br />
<textarea cols="60" rows="5" id="box2">PRESENT: </textarea>
<br /><br />
<textarea cols="60" rows="5" id="box3">FUTURE: </textarea>

<br /><br />
<input name="" type="button" />
<br /><br />
<textarea cols="60" rows="5" id="box4">All Past Present Future</textarea>
</form>
4

5 に答える 5

3

textarea値を抽出するだけで、それらの連結をこの「aggregate」textareaの値にします。次のように、jQueryを使用して行うのは非常に簡単です。

$('#button_id').click(function() {
  $('#box4').val(
    $('#box1').val() + $('#box2').val() + $('#box3').val()
  );
});
于 2012-07-17T20:58:30.987 に答える
2

これを試して:

$('button').click(function(){
    var text = "";
    $('textarea:not(:eq(3))').each(function(){
       text += this.value
    })
    $('textarea:eq(3)').val(text)    
})

デモ

于 2012-07-17T20:59:40.110 に答える
0

jsFiddle: http: //jsfiddle.net/wCPbY/3/

// Runs on document ready
$(document).ready(function()
{
    // Grabs each text in the textareas based on the id, added spaces in between.
    var text = $("#box1").text() + " " + $("#box2").text() + " " + $("#box3").text();

    // Appends the text to box4.
    $("#box4").text( text );
});​
于 2012-07-17T21:01:01.110 に答える
0

jQueryを使用すると、必要なすべての要素をキャプチャするセレクターを作成できます。HTMLを変更して、クラス属性に一致する要素を指定し、セレクターがそれらをグループ化できるようにすることができます。

<textarea cols="60" rows="5" class="textGroup" id="box1">PAST: </textarea>
<textarea cols="60" rows="5" class="textGroup" id="box2">PRESENT: </textarea>
<textarea cols="60" rows="5" class="textGroup" id="box3">FUTURE: </textarea>
<textarea cols="60" rows="5" id="box4">All Past Present Future</textarea>

すべてのテキスト領域を取得するためのセレクターは-$(".textGroup")です。
今、私たちがしなければならないのは、それらすべてを繰り返し処理し、それらのコンテンツを収集して、メインのAll Past Present Futureテキストエリアに追加することです。

var wholeString = '';
$(".textGroup").each(function(index,elem){
  wholeString += $(elem).text();
});

$("#box4").text(wholeSrting);
于 2012-07-17T21:01:15.640 に答える
0

jQueryのようなJavaScriptライブラリ全体をロードする必要はありません。この単純なJavaScriptを試してください(スケーラビリティーのために構築されています!)

var textboxes = document.getElementsByTagName('textarea'),
    box4 = document.getElementById('box4'),
    i;

for (i = 0; i < textboxes.length - 1; i++) {
    box4.value += textboxes[i].value;
}

そして、これがあなたのjsFiddleです。

于 2012-07-17T21:36:11.753 に答える