2

2つの数字があります。ユーザーが回答を入力し、Enterキーまたは[次へ]ボタン(フォームをアクティブ化)をクリックします

次のすべてのアクションはjavascriptでロードされるため、フォームは常に「falseを返す」ようにします。ユーザーが正しい答えを入力し続ける限り、それは機能しますが、間違った答えを入力すると、最初に「ねえ、これは何ですか?」と表示されます。ボックスですが、ユーザーが再度応答しようとすると、ページ全体が再ロードされます:/

あなたはここでそれを見ることができます: 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;
    });
});
4

3 に答える 3

3

通常、2回目の送信でフォームが失敗するのは、JavaScriptイベントハンドラーにエラーがあり、falseを返すことができなかったことを示しています。これらをデバッグするには、ページ間を移動するときにログ情報を保持するオプションを備えたブラウザのjavascriptコンソールを使用すると便利です。(このオプションはPreserve Log upon Navigation、Webkitデバッガーで呼び出されます)。この手法を使用して、私は見つけました:

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。次に、2回目に送信ボタンをクリックすると、コードは失敗します。

代わりに、その戻り値を別の変数に割り当てる必要があります。

     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

于 2012-12-21T18:31:40.963 に答える
0

falseを返す必要はありません。this-(theAnswer ==correctAnswer)はすでにfalseであり、スクリプトはそれを認識しています。したがって、falseを返す行を削除します。

于 2012-12-21T18:27:17.137 に答える
0

送信アクション全体を実行する必要があるようです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;
    });


});​

デモ

于 2012-12-21T18:39:26.517 に答える