JS - 如何从 for 循环内的新行开始？

Question

我试图在点击一个按钮后打印 6 个随机数。然后每次我再次点击按钮时，随机数应该从新行开始但我不知道如何。我尝试了一切，但没有任何效果。感谢您的帮助。

        function fname() {
            for(i=1; i<=6; i++) {
                    number = number + Math.floor(Math.random() * 47 + 1) + "-";
                    var print = number + " GOOD LUCK!";
            }
            document.getElementById("total").value = print;
        }

<!DOCTYPE html>
<html>
    <head>
        <title>Let's ROLL!</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <style>
            input, button {display: block;}
        </style>
        <script>
        var number = "";
        function fname() {
            for(i=1; i<=6; i++) {
                    number = number + Math.floor(Math.random() * 47 + 1) + "-";
                    var print = number + " GOOD LUCK!";
            }
            document.getElementById("total").value = print;
        }
        </script>
    </head>
    <body>
        <div>
            <button onclick="fname()">ROLL!</button>
            <textarea id="total" rows="12" cols="50" readonly></textarea>
        </div>
    </body>
</html>

Answer 1

添加“\n”。

我假设您想在文本区域中连接新文本，因此您应该使用 += 而不是 =:

document.getElementById("total").value += print + "\n";

Answer 2

不是 100% 清楚您想要换行的位置，但在文本区域中，换行符是 \n。如果这是在 HTML 元素中，您将使用 <br />.

var number = "";

function fname() {
  for (i = 1; i <= 6; i++) {
    number = number + Math.floor(Math.random() * 47 + 1) + "-";
  }
  number = number + "\n";
  
  var print = number + "GOOD LUCK!";
  document.getElementById("total").value = print;
}

 input,
 button {
   display: block;
 }

<div>
  <button onclick="fname()">ROLL!</button>
  <textarea id="total" rows="12" cols="50" readonly></textarea>
</div>

Answer 3

您可以使用数组，.join() 通过适当的分隔符将数字和行组合在一起。这只会在元素之间插入字符。 \n 在字符串中呈现一个新行。

var button = document.getElementById('roll');
var total = document.getElementById('total');

var rolls = [];

button.onclick = function() {
    var roll = [];
    for(var i=0; i<6; ++i) roll.push(Math.floor(Math.random() * 47 + 1));
    rolls.push(roll.join('-'));
    total.value = rolls.join('\n') + "\nGOOD LUCK!";
}

<button id="roll">ROLL!</button><br>
<textarea id="total" rows="12" cols="50" readonly></textarea>

JS - 如何从 for 循环内的新行开始？

JS - How to start from new line inside for loop?

javascript

for-loop

newline