Question

我正在尝试使用HTML＆textarea和JavaScript创建一个简单的alphabetizer。用户在输入textarea中输入他们的单词，当按下按钮时，按字母顺序排列的列表将显示在输出textarea上。我似乎无法弄清楚如何让它发挥作用。这是我的代码：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset = "utf-8" />

    <title>Alphabetizier</title>
</head>
<body>
<h1>Meico's Alphabetizer</h1>

<button onclick="alphabetize()">Alphabetize!</button>
<textarea input="inputText" rows=5 cols=80 wrap=on></textarea>
<textarea output="outputText" rows=5 cols=80 wrap=on readonly></textarea>

    <script>
    var textarea = document.getElementById("input");
    function alphabetize() {
    textarea.value = textarea.value.split(" ").sort().join(" ")
}
    </script>
</body>
</html>

每当我点击按字母顺序排列按钮时，我都会收到消息＆＃34; TypeError：textarea为null＆＃34;。输出文本区域没有输出。

Answer 1

你弄乱了你的textareas＆＃39;标识：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset = "utf-8" />

  <title>Alphabetizier</title>
</head>
<body>
  <h1>Meico's Alphabetizer</h1>

  <button onclick="alphabetize()">Alphabetize!</button>
  <textarea id="inputText" rows=5 cols=80 wrap=on></textarea>
  <textarea id="outputText" rows=5 cols=80 wrap=on readonly></textarea>

  <script>
    var textarea = document.getElementById("inputText");
var textarea2 = document.getElementById("outputText");
    function alphabetize() {

       textarea2.value = textarea.value.split(" ").sort().join(" ")
    }
  </script>
</body>
</html>

使用两个textareas（一个输入和一个输出）和JavaScript来制作一个alphabetizer

1 个答案: