如何将四个文本框的值复制到HTML中的textarea中？

Question

我有一个表格，其中包含四个textboxes和一个textarea字段。

形式类似于请求表单。我希望将content的四个textboxes复制到textarea。

为此我写了onkeyup事件，它同时将其值复制到textarea，但我希望所有四个文本框值都被复制到文本区域。

这是我写的onkeyup事件

<input type="text" id="C.name" name="C.name" required onkeyup="document.getElementById('message').value=this.value"> 

而且还我附上我的格式的图片为更好的主意代码，在这里的照片，你可以看到一个文本框的值被复制到textarea。

我应该怎么做，使所有的文本框的值被复制到textarea的

Answer 1

创建一个函数，并从onkeyup属性调用它。你的函数可能看起来像：

function fillMessage() { 
    var nam = document.getElementById('name'); 
    var com = document.getElementById('company'); 
    var ema = document.getElementById('email'); 
    var pho = document.getElementById('phone'); 
    var msg = document.getElementById('message'); 
    msg.value = nam.value + com.value + ema.value + pho.value; 
} 

而且每个表单域将有属性onkeyup="fillMessage()"。这是一个live demo。

Answer 2

你需要Concat的输入值和键起事件绑定到所有的投入，沿着这个例子东西线：

var aggregateInput = function() 
{ 
    var value = jQuery('input[name="name"]').val() + 
     jQuery('input[name="company"]').val() + 
     jQuery('input[name="email"]').val() + 
     jQuery('input[name="number"]').val(); 

    jQuery('textarea[name="aggregated"]').val(value); 
} 

jQuery('input[type="text"]').on('keyup', aggregateInput); 

的jsfiddle：http://jsfiddle.net/v9fe2532/1/

更新：

你从来没有表明你在项目中使用jQuery，我也创建了非jQuery版本。使用绑定在所有输入的输入的onkeyup属性使用的onkeyup = “aggregateInput（）” 的下列功能：

function aggregateInput() 
{ 
    var value = document.getElementById('nameInput').value 
     + document.getElementById('companyInput').value 
     + document.getElementById('emailInput').value 
     + document.getElementById('numberInput').value; 

    document.getElementById('aggregated').value = value; 
} 

的jsfiddle：http://jsfiddle.net/v9fe2532/4/