2017-08-27 16 views
0

私は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に入りました。私は本当に誰でも助けることができる助けに感謝します。

+0

bodyタグを閉じる前にJavaScriptを設定するか、DOMContentLoadedを使用してください。 –

答えて

1

ワードラップは必要ありません。すべての入力フィールドを別々の変数にまとめて1つの出力にまとめる必要があります。

<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> 
+0

あなたは素晴らしいです。私はちょうどそれをテストした、ありがとう! –

関連する問題