为什么赢得我疯狂的lib编译?

时间:2017-03-28 23:38:16

标签: javascript html5

所以我必须使用javascript和html制作疯狂的lib。我要求用户输入值,然后按下按钮,它应该使用他们输入的值生成故事。

这是我的HTML:

<ul>
  <li>Your Name: <input type="text" id="name"></li>
  <li>Adjective: <input type="text" id="adjective"></li>
  <li>State: <input type="text" id="state"></li>
  <li>Animal: <input type="text" id="animal"></li>
  <li>Month: <input type="text" id="month"></li>
  <li>Adjective: <input type="text" id="adjective2"></li>
  <li>Animal: <input type="text" id="animal2"></li>
  <li>Object: <input type="text" id="object"></li>
</ul>
<button id="ready-button">Ready</button>
<div id="story"></div>
<script> 
    function madLib() {
      var storyDiv = document.getElementById("story");
      var adjective = document.getElementById("adjective").value;
      var noun = document.getElementById("noun").value;
      var state = document.getElementById("state").value;
      var animal = document.getElementById("animal").value;
      var month = document.getElementById("month").value;
      var adjective2 = document.getElementById("adjective2").value;
      var animal2 = document.getElementById("animal2").value;
      var object = document.getElementById("object").value;
      storyDiv.innerHTML ="One day, " + name + " was in the backwoods of " + state + " riding their pet " + animal + " it wasn't often that " + name + " got the chance to do this so they always made the most of their adventure. Usually, it was a fun experience until that one day in " + month + " they were minding their own business when all of the sudden the " + adjective2 + " " + animal2 + " jumped out from behind a small " + object + ". " + name + " could not beieve what they were seeing.";
    }
    var readyButton = document.getElementById('ready-button');
    readyButton.addEventListener('click', madLib);
</script>

1 个答案:

答案 0 :(得分:0)

似乎你得到了&#34;名词&#34;混淆了&#34; name&#34;抓住你的故事的价值观。 您有<input type="text" id="name"></li>并且在故事中使用name变量几次,但在madLib函数中有

var noun = document.getElementById("noun").value;
//document.getElementById("noun") will be undefined because there is no "noun element"

应该是

var name = document.getElementById("name").value;