Question

我正在尝试制作一个小游戏的东西，你可以输入单词等等，但主要的问题是，当我试图让JavaScript打印出我写的字;它永远不会正常工作！这是我的HTML：

<input id="verb" name="verb" type="text" placeholder="Enter a verb">
<input id="noun" name="noun" type="text" placeholder="Enter a noun">
<button onclick="getWords()">Enter</button>
<p id="output"></p>

这是JavaScript的用法：

var verb = document.getElementById("verb").textContent;
var noun = document.getElementById("noun").textContent;
      function getWords()
      {
          document.getElementById("output").textContent = "You chose " +verb+ " as your verb, and " +noun+ " as your noun";
      }

点击Google Chrome中的输入按钮;它简单地说“你选择undefined作为你的动词，并且未定义为你的名词。”
为什么它不识别元素的内容，只是填入“未定义”，无论输入什么？有更简单的方法吗？提前谢谢！

Answer 1

尝试

  function getWords()
  {
      var verb = document.getElementById("verb").value;
      var noun = document.getElementById("noun").value;
      document.getElementById("output").innerHTML = "You chose " +verb+ " as your verb, and " +noun+ " as your noun";
  }

值将文本保存在输入中，而innerHTML表示元素中的HTML。因此，您需要读取输入的值并将它们存储在段落元素的HTML中。

Answer 2

你非常接近。在你的HTML中，尝试使用

    function getWords() {

    var verb = document.getElementById("verb").value;
    var noun = document.getElementById("noun").value;

      document.getElementById("output").innerHTML = "You chose " + verb + " as your verb, and " + noun + " as your noun.";
    }

这就是你需要这样做的方式 - 你编写代码的方式，vars动词和名词永远不会被阅读。通过将它们包含在函数getWords（）中，您可以确保仅在用户单击按钮后才查看该值。

获取文本内容并使用JavaScript写入HTML

2 个答案: