Question

所以，我正在尝试制作一个Gamebook，它将玩家输入一个表单，然后在点击时显示文本。根据玩家的回答，游戏将回复，依此类推。它有这个游戏的想法：https://jsfiddle.net/MacroG0D/9g1130pm/

所以，下面你可以看到我确实了解如何添加文本，使用点击和追加。我无法弄清楚MacroG0D（在小提琴中）如何将它应用到他的游戏中。因为我不能让它发挥作用。

我也希望显示玩家名称并进行此交互。因为我似乎无法让它发挥作用，所以感觉就像首先编写整个游戏一样愚蠢，因为如果这不起作用我就无法测试它。

有人可以解释一下jsfiddle是如何完成的，还是有一些提示？



    $(document).ready(function() {
      $("#button").click(function() {
        var toAdd = $("input[name=checkListItem]").val();
        $(".list").append('<div class="item">' + toAdd + '</div>');
      });
    });
    h2 {
      font-family: arial;
    }

    form {
      display: inline-block;
    }

    #button {
      display: inline-block;
      height: 20px;
      width: 70px;
      background-color: #cc0000;
      font-family: arial;
      font-weight: bold;
      color: #ffffff;
      border-radius: 5px;
      text-align: center;
      margin-top: 2px;
    }

    .list {
      font-family: garamond;
      color: #cc0000;
    }
    <!DOCTYPE html>
    <html>
    <head>
      <title>Gamebook</title>
      <link rel="stylesheet" type="text/css" href="CODEC.css" />
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
      <script type="text/javascript" src="CODEC.js"></script>
    </head>
    <body>
      <h2>The Dutch Golden Age</h2>
<p>Contains an introduction story </p>
<p>Are you ready to play the game?</p>
      <form name="checkListForm">
        <input type="text" name="checkListItem" />
      </form>
      <div id="button">Answer</div>
      <br/>
      <div class="list"></div>
    </body>
    </html>

如何在游戏手册中显示玩家输入

0 个答案: