我如何从textarea获取价值并垂直打印？
[英]How can i get value from textarea and print it vertically?
问题描述
This is my array for example from the first textarea: 
例如，这是我在第一个文本区域中的数组：
$names=array('Abcd','Efgh','Jklm');
And for now this is my script: 现在，这是我的脚本：
function myFunction() {
var stringArray = document.getElementById('edno').value.split('\n');
document.getElementById("dve").innerHTML = stringArray;
}
My HTML: 我的HTML：
<body>
<div id="first">
<textarea id="edno"></textarea>
<p>Click the button</p>
<button type="button" onclick="myFunction()"></button>
<p id="demo"></p>
</div>
<div id="second">
<textarea id="dve">
</textarea>
<script type="text/javascript">Here is my Script<script>
</div>
</body>
I want to print the value, splited by , , char by char, vertically. 我想打印的价值，通过splited ,成炭，焦炭，垂直。 Example of desired result when input is abcd,efgh,jklm : 输入为abcd,efgh,jklm时所需结果的abcd,efgh,jklm ：
3 个解决方案
解决方案1
0 2018-08-29 11:40:43
If you just want to copy the text from the first textarea to the second you can do it simply like this: 如果您只想将文本从第一个文本区域复制到第二个文本区域，则可以像下面这样简单地进行操作：
function myFunction() { var valueOfFirstTextarea = document.getElementById('edno').value; document.getElementById("dve").innerHTML = valueOfFirstTextarea; }
<div id="first"> <textarea id="edno"></textarea> <p>Click the button</p> <button type="button" onclick="myFunction()">Click Me</button> </div> <div id="second"> <textarea id="dve"></textarea> </div>
解决方案2
0 已采纳 2018-08-29 11:49:32
You can get the value, split it character by character and then print it with a line break \\n if you will use in an input element, or with <br> if you gonna use another kind of element. 您可以获取该值，将其逐个字符分割，然后在输入元素中使用换行符\\n进行打印，或者在要使用另一种元素时使用<br>进行打印。
The code below shows that. 下面的代码显示了这一点。
function myFunction() { let stringArray = document.getElementById('edno').value.split(""); let txtResult = document.getElementById("dve"); txtResult.value = ""; for (var char of stringArray){ var character = char + "\\n"; txtResult.value += character; } }
#dve{ height: 190px; }
<div id="first"> <textarea id="edno"></textarea> <button type="button" onclick="myFunction()">Click Me!</button> <p id="demo"></p> </div> <div id="second"> <textarea id="dve"></textarea> </div>
EDIT 编辑
To help you with what you commented here's a possible solution: It's much harder, because you need to iterate in the loop of characters in a very different way. 为了帮助您解决您的评论，这里有一个可能的解决方案：这要困难得多，因为您需要以完全不同的方式遍历字符循环。
To avoid problem with different rows/columns sizes I needed to get the longest word length, as you can see in the code in the var called biggerLength 为了避免出现不同的行/列大小问题，我需要获得最长的字长，如您在var中的代码中所biggerLength
Please, see the code, any question you have about iteration, post in the comments. 请查看代码，如果您对迭代有任何疑问，请在评论中发布。
function myFunction() { let txtResult = document.getElementById("dve"); let str = document.getElementById('edno').value; let strArray = []; txtResult.value = ""; if (str.indexOf(",") > -1){ strArray = str.split(","); let sortedStrArray = [...strArray].sort((a,b) => a.length < b.length); //copy the original array to not mess with it, then sort bigger to smallest length let biggerLength = sortedStrArray[0].length; for (var i = 0; i < biggerLength; i++){ let columnStr = ""; for (var j = 0; j < strArray.length; j++){ let chars = strArray[j]; let char = chars[i]; if (char != null){ columnStr += char; }else{ columnStr += " "; } } txtResult.value += columnStr + "\\n"; } } else { strArray = str.split(""); for (var char of strArray){ txtResult.value += char + "\\n"; } } }
#dve{ height: 200px; width: 230px; }
<div id="first"> <textarea id="edno" >abcd,efgh,jklm</textarea> <button type="button" onclick="myFunction()">Click Me!</button> <p id="demo"></p> </div> <div id="second"> <textarea id="dve"></textarea> </div>
解决方案3
0
If you want to print the values vertically, split all the values by space and append that with <br> and append the same to 如果要垂直打印值，请按空格分割所有值，并用<br>附加，然后将其附加到
elements = ['Abcd','Efgh','Jklm']; document.getElementById("dve").innerHTML = elements.join('</br>')
This will print all the elements in vertical in the innerHTML of dev element. 这将在dev元素的innerHTML中垂直打印所有元素。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.