2016-08-14 18 views
0

私は、ブラウザに入力された情報を取り込んでアクションに変換して実行するテキストベースのゲームを作成しようとしています。私はそれを最初の答えのために働かせることができますが、それは最初の答えの結果を表示した後、2番目の答えをロードしていないようです。また、一度提出すると、すべての症例が表示され、入力なしで画面に追加されます。どのようにしてこの問題を解決するか、またはケースが繰り返されることを確認するための考え方 First step Second After hitting submit HTML:ケースが2番目の入力で機能していませんか?

<!DOCTYPE html> 
<html> 
<head> 
    <title>Lord of the Deahsticks</title> 
    <link href="css/text-game.css" rel="stylesheet" type="text/css"> 
</head> 
<body> 
<div class="info"> 
    <h1 class="title">Lord of the Deathsticks</h1> 
</div> 

<div class="gameboard"> 
    <div class="event"> 
     <p>Hello this is the game!</p> 
    </div> 
    <div class="event"> 
     <p>You are awoken by a sound...You need to get up already, you're going to be late for you shift at the slave factory!</p> 
    </div> 

</div> 
<form> 
    <input type="text" id="action" name="what to do"> 
    <input type="submit" name="button"> 
</form> 
<script src="js/controllers/controller.js"></script> 
<script src="js/model/characters.js"></script> 
<script src="js/JQuery/jquery-3.1.0.js"></script> 
<script src="js/JQuery/text-game-JQuery.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
</body> 
</html> 

メインのjs/jqueryの

var template = function(action){ 
    return '<div class="event"><p>'+ action +'</p></div>' 
}; 
var display = function(input){ 
    if(input !== "") { 
     var html = template(input); 
     $(html).appendTo('.gameboard'); 
    } else { 
     alert("You need to imput an appropriate answer"); 
    } 
    $('#action').val(""); 
    $('#mydiv').scrollTop(($('#mydiv').height()*2)); 
}; 

var main = function(){ 
    $('form').submit(function(){ 
     event.preventDefault(); 
     var action = $('#action').val(); 
     var input = action.toLowerCase(); 
     display(action); 
     interact(input); 
     return false; 
    }); 

}; 


$(document).ready(main); 

コントローラー:

var where = "intro"; 
var wait = function(){ 

}; 
var interact = function(input) { 
    switch(where) { 
     case "intro": 
      if (input === "stay in bed") { 
       display("you sleep for 2 more hours"); 
       where = "police"; 
      } else if (input === "wake up") { 
       display("You wake up and head to the slave factory"); 
       where = "on route"; 
      } else { 
       display("You need to submit a valid response"); 
      } 
     break; 

     case "police": 
      display("You are awaken by three slave police standing at your bed!"); 
      wait(); 
      display("Our records show this is you third offence citizen #000986642, you will now be sent for disciplinary reconditioning. Prepare to be detained.") 
      wait(); 
      display("what will you do? -Go with them? -Fight them? -Try to Escape"); 

      if (input === "go with them") { 
       display("You are escorted to the deathcamp"); 
       where = "deathcamp1"; 
      } else if (input === "fight them") { 
       display("You jump out of bed and prepare for a fistfight"); 
       where = "fistfight"; 
      } else if (input === "try to escape") { 
       display("you attempt to jump through your window"); 
       where = "window1"; 
      } else { 
       display("You need to submit a valid response"); 
      } 
      break; 
    } 
}; 
+0

だから、あなたが最初に回答を提出し、それが動作しますが、それはすぐに(物語)のラインあなたのすべての表示を与えますか?しかし、ストーリーに応じて1つ(または2つ)を与えることができたら、それ以降はさらに入力できるようにしたいのですか? –

+0

最初の入力は正しい結果(表示)のみを表示し、続行せずに次の質問を表示します。フォームをもう一度、空白にするか、何かを入力したら、最初の条件(死者に送られた)の結果で終了する残りのケースを表示します。 – l34lo1

+0

ちょっとした論理エラーがあります。あなたのコードはそのまま動作します!私は答えを含んだ。残りの部分は幸運です! –

答えて

1

あなたは正しい考えを持っているし、あなたのコードが動作します。それはあなたのロジックのいくつかを再考する必要があり、おそらくいくつかのエラー処理(必要な場合)を追加する必要があります。あなたはstay in bedコマンドで出力を持ちたい

var interact = function(input) { 
    switch(where) { 
     case "intro": 
      if (input === "stay in bed") { 
       setTimeout(function() { display("you sleep for 2 more hours"); }, 1000); 
       setTimeout(function() { display("You are awaken by three slave police standing at your bed!"); }, 3000); 
       setTimeout(function() { display("Our records show this is you third offence citizen #000986642, you will now be sent for disciplinary reconditioning. Prepare to be detained."); }, 5000); 
       setTimeout(function() { display("what will you do? -Go with them? -Fight them? -Try to Escape"); }, 7000); 
       where = "police"; 
      } else if (input === "wake up") { 
       display("You wake up and head to the slave factory"); 
       where = "on route"; 
      } else { 
       display("You need to submit a valid response" + where); 
      } 
      break; 

     case "police": 
      if (input === "go with them") { 
       display("You are escorted to the deathcamp"); 
       where = "deathcamp1"; 
      } else if (input === "fight them") { 
       display("You jump out of bed and prepare for a fistfight"); 
       where = "fistfight"; 
      } else if (input === "try to escape") { 
       display("you attempt to jump through your window"); 
       where = "window1"; 
      } else { 
       display("You need to submit a valid response"); 
      } 
      break; 
    } 
}; 

、それは一度だけ発生しますその方法:

私はあなたのコードを更新しました。次に、次のケースを使用して、必要に応じて次の出力またはエラーメッセージを表示します。あなたの物語に幸運!

また、待機ロジックには.setTimeout(function, milliseconds)が便利です。私も答えでそれを含めました。私はこれが正しい持ちの場合)

Working sample.

+0

私は最終的にこれの手を得ているかもしれないと思います!あなたの助けをもう一度ありがとう! – l34lo1

関連する問題