嵌套的JavaScript函數，或者可能是While（）循環

Question

我知道關於這個主題已經發布了兩個問題，但它們並沒有真正回答我的問題（或者因為我只是編碼器的那么低）。 我的問題是我正在努力學習java（並且多次失敗），所以我正在嘗試制作游戲。 我輸入了這個龐大的代碼，它開始看起來很糟糕，所以我自己想oO（為什么不嵌套一些while（）語句，這會壓縮代碼！）......它不起作用，我不明白為什么。

    $(document).ready(function() {

        $("#console").fadeIn(3000); //A console to keep everything good

        $("form").submit(function() { //User input
            var input = $("#command_line").val(); //A nifty box to put your answers in
            var check = false;
            function check() { //If you don't follow directions this happens
                check = true;
            };
        //startup
        function start() { //This function is nested, and runs
            var yes = false; //defining yes
            var no = false; //defining no
            while (yes == false && no == false && currentarea == "startup") { //<-- This while loop does nothing?
                if (input == "yes") {
                    yes = true; //changing yes to true
                    $("<p>Great! What is your gender? Type <u><b>m</b></u> for Male or <u><b>f</b></u> for Female.</p>").hide().insertBefore("#placeholder").fadeIn(1000);
                    check();
                }
                else if (input == "no") {
                    no = true; //changing no to true
                    $("<p>Sorry to see you go. Press F5 to restart, or exit your browser.</p>").hide().insertBefore("#placeholder").fadeIn(1000);
                    check();
                }
                else if (yes == true || no == true) {   
                    $("<p>You've already answered this question.</p>").hide().insertBefore("#placeholder").fadeIn(1000);
                    check();
                }
            }   
        };

然后從這里我將嵌套其他函數，使用嵌套的'if'，'for'或'while'語句來壓縮代碼。 在變化之前看起來更加駭人聽聞，看看其他例子，我看到這不是你為游戲編碼的方式，但我正在努力學習...語音編碼。 任何人都可以告訴我為什么嵌套函數啟動，但'while'循環什么都不做？ 我嘗試將其更改為'if'語句，使用'if'和'else if'語句嵌套，但仍然沒有。 我希望這是一個很好的問題，我不只是在浪費人們的時間。

-編輯-

我必須將else if（yes == true || no == true）更改為if語句，並將其插入while循環外部，以使其正常工作。 現在唯一的問題是，我無法脫離start（）函數循環。 我嘗試在函數內部移動start（）調用（這是愚蠢的，但我想我會嘗試），調用下一個函數gender_assignment（）; 在前一個語句的末尾（if（yes == true || no == true））我試圖讓性別函數啟動。 無論我嘗試什么，我都會繼續說“你已經回答了這個問題。” 我如何打破下一個功能？

這就是我現在擁有的：

$(document).ready(function() {

$("#console").fadeIn(3000); //A console to keep everything looking good

$("form").submit(function() { //User input
    var input = $("#command_line").val(); //A nifty box to put your answers in
    var check = false;
        function check() { //If you don't follow directions this happens
            check = true;
        };

    //startup
    function start() { //This function is nested, and runs
        while (yes == false && no == false) { //<-- This while loop does nothing?
            if (input == "yes") {
                yes = true;
                $("<p>Great! What is your gender? Type <u><b>m</b></u> for Male or <u><b>f</b></u> for Female.</p>").hide().insertBefore("#placeholder").fadeIn(1000);
                check();
            }
            else if (input == "no") {
                no = true;
                $("<p>Sorry to see you go. Press F5 to restart, or exit your browser.</p>").hide().insertBefore("#placeholder").fadeIn(1000);
                check();
            }
        }
        if (yes == true || no == true) { //print text, then move to next function <-- Why no move to next function
            $("<p>You've answered that already.</p>").hide().insertBefore("#placeholder").fadeIn(1000);
            check();
        }
    };
    start();
    //gender
    function gender_assignment() {
        while (male == false && female == false) {
            if (input == "m") {
                male = true;
                gender = "male";
                document.getElementById("gender").innerHTML = gender;
                $("<p>Nice to meet cha, bro. What's your name?</p>").hide().insertBefore("#placeholder").fadeIn(1000);
                check();
            }
            else if (input == "f") {
                female = true;
                gender = "female";
                document.getElementById("gender").innerHTML = gender;
                $("<p>Sup, Girl? What's your name?</p>").hide().insertBefore("#placeholder").fadeIn(1000);
                check();
            }
        }
        if (male == true || female == true) { //print text, then move to next function
            $("<p>Identity issues? You are already a " + gender + ".</p>").hide().insertBefore("#placeholder").fadeIn(1000);
            check();
        }
    };
    gender_assignment();

啊，對於這里沒有顯示的所有值，我已將它們遠遠高於此代碼。 如果你想讓我發布整張表，我可以做到。

-Edit /回答最后一個問題/新問題arrises-

好吧，我終於看到了我做錯了什么，並且在我有另一個問題之前能夠在代碼中得到這么多。 答案是，我沒有給游戲提供足夠的信息。

    //I had these variables already, but never posted them.
    var yes = false;
    var no = false;
    currentarea = "Start";
    //I added some do->if structures that I didn't have before.
    function start() {
        while(yes != true && no != true && currentarea == "Start") {
            if (input == "yes") {
                yes = true;
                $("<p>Great! What is your gender? Type <u><b>m</b></u> for Male or <u><b>f</b></u> for Female.</p>").hide().insertBefore("#placeholder").fadeIn(1000);
                currentarea = "Gender Assignment";  //<--This is what I had to put to get to next function. Easy enough... now that I know. Lol.
                check();
            }
            else if (input == "no") {
                no = true;
                $("<p>Sorry to see you go. Press F5 to restart, or exit your browser.</p>").hide().insertBefore("#placeholder").fadeIn(1000);
                check();
            }
        }  //<--I also noticed that the if->true statement was stupid, especially when I was telling it where to proceed to.
    }
    start();

    function gender_assignment() {
        while (male != true && female != true && currentarea == "Gender Assignment") {
            if (input == "m") {
                male = true;
                gender = "Male";
                HP = m_hp;
                document.getElementById("HP").innerHTML = HP;
                MP = m_mp;
                document.getElementById("MP").innerHTML = MP;
                Attack = m_attack;
                document.getElementById("Attack").innerHTML = Attack;
                Endur = m_endur;
                document.getElementById("Endur").innerHTML = Endur;
                Blk = m_blk;
                document.getElementById("Blk").innerHTML = Blk;
                currentarea = "Name";
                document.getElementById("gender").innerHTML = gender;
                $("<p>Nice to meet cha, bro. What's your name?</p>").hide().insertBefore("#placeholder").fadeIn(1000);
                check();
            }
            else if (input == "f") {
                female = true;
                gender = "Female";
                HP = f_hp;
                document.getElementById("HP").innerHTML = HP;
                MP = f_mp;
                document.getElementById("MP").innerHTML = MP;
                Attack = f_attack;
                document.getElementById("Attack").innerHTML = Attack;
                Endur = f_endur;
                document.getElementById("Endur").innerHTML = Endur;
                Blk = f_blk;
                document.getElementById("Blk").innerHTML = Blk;
                currentarea = "Name";
                document.getElementById("gender").innerHTML = gender;
                $("<p>Sup, Girl? What's your name?</p>").hide().insertBefore("#placeholder").fadeIn(1000);
                check();
            }
        }
    }
    gender_addignment();

現在我明白了，並且將數據插入到html頁面的理解是由document.getElementById("whatyounamedthevariable").innerHTML = whatyounamedthevariable完成的document.getElementById("whatyounamedthevariable").innerHTML = whatyounamedthevariable 。 這兩件事共同幫助了我很多。

現在，問題是......為什么某些事情會報告Null？

[例子] endurup = false; endurUp = 0; document.getElementById("endurUp").innerHTML = endurUp; endurup = false; endurUp = 0; document.getElementById("endurUp").innerHTML = endurUp; 使用FireFox和Crome中的調試器都會顯示此消息。 cannot set property innerHTML of null. 那是什么意思？ 我將endurUp設置為0！ 在html方面，我在代碼中有這個， Endurance Up: <span id="endurUp">0</span> 。 這還不夠，還是我沒有以某種方式激活變量？

-編輯/答案-

在我的html方面的一個標簽中，我有</spam>而不是</span> 。 大聲笑！

Answer 1

正如@Ankur指出你永遠不會調用start函數

你可以這樣做：

  $(document).ready(function() {
      $("#console").fadeIn(3000); //A console to keep everything good

      $("form").submit(function() { //User input
          var input = $("#command_line").val(); //A nifty box to put your answers in
          var check = false;

          function check() { //If you don't follow directions this happens
              check = true;
          };
          //startup
          function start() { //This function is nested, and runs
              var yes = false; //defining yes
              var no = false; //defining no
              while (yes == false && no == false && currentarea == "startup") { //<-- This while loop does nothing?
                  if (input == "yes") {
                      yes = true; //changing yes to true
                      $("<p>Great! What is your gender? Type <u><b>m</b></u> for Male or <u><b>f</b></u> for Female.</p>").hide().insertBefore("#placeholder").fadeIn(1000);
                      check();
                  } else if (input == "no") {
                      no = true; //changing no to true
                      $("<p>Sorry to see you go. Press F5 to restart, or exit your browser.</p>").hide().insertBefore("#placeholder").fadeIn(1000);
                      check();
                  } else if (yes == true || no == true) {
                      $("<p>You've already answered this question.</p>").hide().insertBefore("#placeholder").fadeIn(1000);
                      check();
                  }
              }
          };
          start();
      });
  });

另外，不要在事件中聲明新函數（例如在表單提交上）。 在代碼的頂部聲明它