只有在答案正確時才返回false。

Question

有兩個數字。用戶填寫回答&點擊輸入或「下一步」按鈕（激活表單）

我希望窗體始終「返回false」，因爲所有下一個操作都使用javascript加載。 只要用戶一直填寫正確的答案，但是當你填寫錯誤的答案時，它會首先向你顯示「嗨，這是什麼？」框，但twhen用戶試圖再次回答，整個頁面realoaded：/

你可以在這裏看到： http://skolresurser.se/matematik/simple/

HTML

<form id="theChallenge"> 
    <h1> 
     <span class="first">2</span> 
     <span style="position: relative; top: 0.24em; margin: 0 6px;">*</span> 
     <span class="second">6</span> 
     <span style="margin-left: 0.13em; font-size: 0.8em; position: relative; top: -0.13em; margin-right: -0.60em;">=</span> 
    </h1> 
    <div id="notReally" style="display: none;"> 
     <h2>Not reeaaaaally:</h2> 
     <span id="actually"></span> 
    </div> 
    <input type="number" class="answerInput"><br> 
    <button class="2btn btn-large btn-success checkAnswer" href="#">Next</button> 
</form> 

JS：

$(function() { 
    function biggestNumber() { 
     return Math.max.apply(this, arguments); 
    } 

    $("#theChallenge").submit(function() { 
     first = $(".first").text(); 
     second = $(".second").text(); 
     correctAnswer = parseInt($(".first").text()) * parseInt($(".second").text()); //parseInt = omvandla text till siffra.. och slå ihop de två alternativen! och detta är då vårt rätta svar   
     theAnswer = $(".answerInput").val() //Vad har användaren skrivit in för svar? 
     alert('first' + first); 

     //Check if answer is correct 
     if (theAnswer == correctAnswer) { 
      //Create new numbers 
      var randomNum = 1 + Math.ceil(Math.random() * 12); /* Pick random number between 1 and 12 */ 
      $('.first').text(randomNum); 
      var randomNum = 1 + Math.ceil(Math.random() * 12); /* Pick random number between 1 and 12 */ 
      $('.second').text(randomNum); 
     } else { 
      //Show the person doing the test that 
      $("#notReally").slideDown('fast'); 
      $("h1").slideUp('medium'); 

      biggestNumber = biggestNumber(first, second); //en funktion som är inlagd längre upp!! 
      if (biggestNumber == first) { //Om största numret = första numret, då är det, det andra numret vi vill stapla upp, annars är det ju första siffran vi vill stapla upp "största siffran antalet gånger". 
       theOtherNumber = second; 
      } else { 
       theOtherNumber = first; 
      } 
      staplaUpp = theOtherNumber; //Börja med att lägga in den mindre siffran en gång först, och sedan för varje till " +siffran " 
      for (var i = 0; i < biggestNumber - 1; i++) { //För varje antal det finns av den mindre siffran, stapla upp den med plus emellan! 
       staplaUpp = staplaUpp + '<span style="margin:0 0.2em;">+</span>' + theOtherNumber; 
      } 
      $("#actually").append(staplaUpp); 

     } 

     $(".answerInput").val(''); 
     alert('first' + first); 
     return false; 
    }); 
}); 

Answer 1

通常情況下，第二次提交時失敗的表單表明JavaScript事件處理程序中有一個錯誤，它阻止它返回false。要調試這些內容，在瀏覽器中使用JavaScript控制檯可以選擇在頁面之間導航時保​​留日誌信息。 （這個選項在webkit調試器中被稱爲Preserve Log upon Navigation）。使用這種技術，我發現：

Uncaught TypeError: number is not a function skolresurser.se:137 
(anonymous function) 

看的代碼段，我可以看到的問題是在這裏：

biggestNumber = biggestNumber(first,second); //en funktion som är inlagd längre upp!! 

當您指定biggestNumber自身所具有的返回值，覆蓋功能biggestNumber，編號爲biggestNumber。然後，第二次點擊提交按鈕時，代碼失敗。

相反，你應該是返回值分配給不同的變量：

 var bigNum = biggestNumber(first,second); //en funktion som är inlagd längre upp!! 
     if(bigNum==first){ //Om största numret = första numret, då är det, det andra numret vi vill stapla upp, annars är det ju första siffran vi vill stapla upp "största siffran antalet gånger". 
     theOtherNumber=second; 
     }else{ 
     theOtherNumber=first; 
     } 
     staplaUpp = theOtherNumber; //Börja med att lägga in den mindre siffran en gång först, och sedan för varje till " +siffran " 

     for(var i = 0; i < bigNum-1; i++) { //För varje antal det finns av den mindre siffran, stapla upp den med plus emellan! 
      staplaUpp = staplaUpp + '<span style="margin:0 0.2em;">+</span>'+theOtherNumber; 
     } 
     $("#actually").append(staplaUpp); 

那麼你biggestNumber功能仍然是下一次它被稱爲function。

Answer 2

不需要返回錯誤。這 - （theAnswer == correctAnswer）已經是假的，腳本知道..所以刪除行返回false。

Answer 3

看來你需要prevetDeafult整體上提交的動作，也是問題biggestNumber的重新定義，我解決了重新定義，使用本地化變量：

$(function() { 
    function biggestNumber() { 
        return Math.max.apply(this, arguments); 
    } 

    $("#theChallenge").submit(function(e) { 


        e.preventDefault(); //<--HERE 


        first = $(".first").text(); 
        second = $(".second").text(); 
        correctAnswer = parseInt($(".first").text()) * parseInt($(".second").text()); //parseInt = omvandla text till siffra.. och slå ihop de två alternativen!  och detta är då vårt rätta svar 
        theAnswer = $(".answerInput").val() //Vad har användaren skrivit in för svar? 

        //Check if answer is correct 
        if (theAnswer == correctAnswer) { 
            //Create new numbers 
            var randomNum = 1 + Math.ceil(Math.random() * 12); /* Pick random number between 1 and 12 */ 
            $('.first').text(randomNum); 
            var randomNum = 1 + Math.ceil(Math.random() * 12); /* Pick random number between 1 and 12 */ 
            $('.second').text(randomNum); 
        } else { 
            //Show the person doing the test that 
            $("#notReally").slideDown('fast'); 
            $("h1").slideUp('medium'); 


            var biggestNumber = biggestNumber(first, second); //en funktion som är inlagd längre upp!! 
      //^--HERE 


            if (biggestNumber == first) { //Om största numret = första numret, då är det, det andra numret vi vill stapla upp, annars är det ju första siffran vi vill stapla upp "största siffran antalet gånger". 
                theOtherNumber = second; 
            } else { 
                theOtherNumber = first; 
            } 
            staplaUpp = theOtherNumber; //Börja med att lägga in den mindre siffran en gång först, och sedan för varje till  " +siffran " 
            for (var i = 0; i < biggestNumber - 1; i++) { //För varje antal det finns av den mindre siffran, stapla upp den med plus emellan! 
                staplaUpp = staplaUpp + '<span style="margin:0 0.2em;">+</span>' + theOtherNumber; 
            } 
            $("#actually").append(staplaUpp); 

        } 

        $(".answerInput").val(''); 
        alert('first' + first); 
        return false; 
    }); 


});​ 

DEMO