打破onClick（HTML）内部的界限

Question

I want to break the line after the appending of code. Example:

string1= abc
string2= 123    

I am geting the appending as abc 123. But i want it as

abc

123

  <input name="string1" >    
 <input name="string2" ><p>    
 <input name="showMeArea" readonly="true"><br>    
 <input type="button" value="Combine Strings"    
 OnClick="showMeArea.value= string1.value + ' ' +string2.value;"></p>        

Answer 1

To insert a line-break in Javascript simply insert \\n

showMeArea.value= string1.value + '\\n' +string2.value;

Answer 2

just add new line sign \\n

OnClick="showMeArea.value= string1.value + '\n' +string2.value;

also note: you should use textarea. input field cannot display multiline text

Answer 3

You can either use an escape, such as \\n or you can just use <br> . The br is a line break within HTML and \\n and within Javascript.

Answer 4

You cannot insert a line break into the value of an <input> element with type=text (the default), since it is by definition for a single line of input. If you try to insert \\n there, browsers strip it off. You need to use eg a textarea element instead. Moreover, your code that refers to elements by using their name attribute values as variable identifiers is obsolete and does not work in many modern browsers.

The following works:

 <input name="string1" id="string1"> <input name="string2" id="string2"><p> <textarea name="showMeArea" id="showMeArea" readonly="true"></textarea><br> <input type="button" value="Combine Strings" OnClick="document.getElementById('showMeArea').value = document.getElementById('string1').value + '\\n' + document.getElementById('string2').value;"></p> 

Answer 5

you can use

<script>
function combine() {
   var s1 = document.getElementById("string1").value
   var s2 = document.getElementById("string2").value
   document.getElementById("showMeArea").value = s1 +"\n\n" + s2
   document.getElementById("showMeAreaHtml").innerHTML = s1 +"<br><br>" + s2
}
</script> 
<input name="string1" id="string1">     
<input name="string2" id="string2">
<input type="button" value="Combine Strings" onclick="combine()">
<br>
<textarea name="showMeArea" id="showMeArea" readonly="true" rows="5" cols="20"></textarea>
<p id="showMeAreaHtml"></p>

Note: use document.getElementById is more cross browser then only name.value; use .value for input and textarea, .innerHTML for other html elements