向列表框添加值,但逐行分隔它们,而不是一行


如何在

下面修改代码,以便允许新添加的值出现在单独的行上,而不是在单击添加按钮时仅显示在同一行上?

预期成果:

Red
Blue
Green
Yellow

当前结果:

RedBlueGreenYellow

.HTML:

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function add() {
  document.getElementById('list').value += " " + document.getElementById('input').value;
}
</script>
</head>
<body>
<input type="text" style="width: 154px;" id="input">
<input onclick="add()" type="button" style="width: 20px; height: 22px;" value="+" id="add"><br>
<textarea style="height: 75px;" id="list"></textarea>
</body>
</html>

更改添加函数,如下所示,

function add() {
  document.getElementById('list').value += " " + document.getElementById('input').value;
}

最新更新