Question

例如，这是我在第一个文本区域中的数组：

$names=array('Abcd','Efgh','Jklm');

现在这是我的脚本：

function myFunction() {
    var stringArray = document.getElementById('edno').value.split('\n');
    document.getElementById("dve").innerHTML = stringArray;
}

我的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>

我想垂直打印由,分割的值。输入为abcd,efgh,jklm时的期望结果示例： {{3}}

Answer 1

如果您只想将文本从第一个文本区域复制到第二个文本区域，则可以像这样：

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>

Answer 2

您可以获取该值，将其逐个字符分割，然后在要输入的元素中使用换行符\n打印，或者在要使用另一种情况下使用<br>打印元素。

下面的代码显示了这一点。

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>

编辑
为了帮助您解决您的评论，这里提供了一种可能的解决方案：这要困难得多，因为您需要以完全不同的方式遍历字符循环。

为避免行/列大小不同的问题，我需要获得最长的字长，正如您在名为biggerLength的var的代码中所看到的那样

请查看代码，您对迭代有任何疑问，并在评论中发布。

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>

Answer 3

如果要垂直打印这些值，请按空格分割所有值，并用<br>附加，然后将其附加到

elements = ['Abcd','Efgh','Jklm']; document.getElementById("dve").innerHTML = elements.join('</br>')

这将在dev元素的innerHTML中垂直打印所有元素。

我如何从textarea获取价值并垂直打印？

3 个答案: