創建一個多輸入到單個輸出文本區域

Question

我對JavaScript不是很有經驗，我正在研究一個小項目並且可以使用一些幫助。實質上，我試圖創建一個表單，可以輸入數據的關鍵點以及文本，而不是將其轉換爲文本框中的格式以便於複製和粘貼。

<script> 
function wordwrap(str, width, brk, cut) { 
brk = brk || '\n'; 
width = width || 60; 
cut = cut || false; 

if (!str) 
    return str; 

var regex = '.{1,' +width+ '}(\\s|$)' + (cut ? '|.{' +width+ '}|.+$' : 
'|\\S+?(\\s|$)'); 

return str.match(RegExp(regex, 'g')).join(brk); 
} 

function convert() { 
var input = document.getElementById("name").value; 
var input = document.getElementById("phone").value; 
var input = document.getElementById("sex").value; 
var input = document.getElementById("options").value; 
var input = document.getElementById("text1").value; 
var input = document.getElementById("text2").value; 
var input = document.getElementById("text3").value; 
input = wordwrap(input, 70, true); 

var output = ""; 

document.getElementById("output").value = output; 
} 

</script> 
<form name="myform" onsubmit="return false;"> 
Name:<br> 
<input type="text" name="name" id="name"><br> 
Phone number:<br> 
<input type="text" name="phone" id="phone"><br> 
Sex?:  
<select name="sex" id="sex"> 
<option value="man">Male</option> 
<option value="woman">Female</option> 
</select> 
<br> 
Options: 
<select name="Options" id="options"> 
<option value="opt1">Option 1</option> 
<option value="opt2">Option 2</option> 
<option value="opt3">Option 3</option> 
</select> 
<br> 
Text 1:<br> 
<textarea name="input" id="text1" cols="70" rows="10"></textarea> 
<br> 
Text 2:<br> 
<textarea name="input" id="text2" cols="70" rows="10"></textarea> 
<br> 
Text 3:<br> 
<textarea name="input" id="text3" cols="70" rows="10"></textarea> 
<br> 
<input type="button" value="Combine" onclick="convert();"><br> 

<textarea name="output" id="output" cols="70" rows="10"></textarea> 
</form> 

我會非常喜歡，甚至格式的文本如何出現這樣

名稱：輸入的名稱

電話：輸入的號碼

性別：選的性別

選項：已選選項

文本1：輸入的文本

文本2：輸入的文本

文本3：輸入的文本

我似乎無法得到的輸出在所有工作。我真的很感激任何人都可以提供的幫助。

Answer 1

也許你不需要wordwrap，事實上你需要捕獲所有輸入字段在單獨的變量，並將它們組合成一個輸出。

<form name="myform" onsubmit="return false;"> 
Name:<br> 
<input type="text" name="name" id="name"><br> 
Phone number:<br> 
<input type="text" name="phone" id="phone"><br> 
Sex?:  
<select name="sex" id="sex"> 
<option value="man">Male</option> 
<option value="woman">Female</option> 
</select> 
<br> 
Options: 
<select name="options" id="options"> 
<option value="opt1">Option 1</option> 
<option value="opt2">Option 2</option> 
<option value="opt3">Option 3</option> 
</select> 
<br> 
Text 1:<br> 
<textarea name="text1" id="text1" cols="70" rows="10"></textarea> 
<br> 
Text 2:<br> 
<textarea name="text2" id="text2" cols="70" rows="10"></textarea> 
<br> 
Text 3:<br> 
<textarea name="text3" id="text3" cols="70" rows="10"></textarea> 
<br> 
<input type="button" value="Combine" onclick="convert()"><br> 

<textarea name="output" id="output" cols="70" rows="10"></textarea> 
</form> 


<script> 

function wordwrap(str, width, brk, cut) { 
brk = brk || '\n'; 
width = width || 60; 
cut = cut || false; 

if (!str) 
    return str; 

var regex = '.{1,' +width+ '}(\\s|$)' + (cut ? '|.{' +width+ '}|.+$' : 
'|\\S+?(\\s|$)'); 

return str.match(RegExp(regex, 'g')).join(brk); 
} 

function convert() { 
var name = document.getElementById("name").value; 
var phone = document.getElementById("phone").value; 
var sex = document.getElementById("sex").value; 
var options = document.getElementById("options").value; 
var text1 = document.getElementById("text1").value; 
var text2 = document.getElementById("text2").value; 
var text3 = document.getElementById("text3").value; 
//input = wordwrap(input, 70, true); 

var output = ""; 

output += "Name: " + name + "\n"; 
output += "Phone: " + phone + "\n"; 
output += "Sex: " + sex + "\n"; 
output += "Options: " + options + "\n"; 
output += "Text1: " + text1 + "\n"; 
output += "Text2: " + text2 + "\n"; 
output += "Text3: " + text3 + "\n"; 


document.getElementById("output").value = output; 

} 

</script>