2

greenb.byethost12.com を見ると、私がこれまでに開発したものが表示されます。今のところ、正解をクリックすると、document.location.reload(index.php) ページ全体が更新されます。

私が望むのは、コンテンツだけが新しい数値セットで更新されることです (JavaScript のみを実行します)。

私が自分自身を明確にしているかどうかはわかりませんが、どんな助けでも喜んでいただければ幸いです。また、まだ見たことのない大量のエラーを作成している可能性があるため、批評を歓迎します。乾杯！

コード：

<!DOCTYPE html>

MathMap 

    <div data-role="page" id="page1">
    <div data-theme="e" data-role="header">
    <a id="score" data-role="button" data-transition="none" href="#page1" data-icon="star"
    data-iconpos="left" class="ui-btn-right">
        Score
    </a>
    <h1>
        MathMap&trade;      
    </h1>
    </div>
<div align="center" data-role="content">
<div align="center"><h1 id="equal">

    </h1></div>
<div id="main" align="center" style="top: 150px;">
    <a id="a" data-role="button" data-theme="e" href="#page1" data-inline="true">

    </a>
    <a id="b" data-role="button" data-theme="e" href="#page1" data-inline="true">

    </a>
    <a id="c" data-role="button" data-theme="e" href="#page1" data-inline="true">

    </a>
    <a id="d" data-role="button" data-theme="e" href="#page1" data-inline="true">

    </a></div>
   <script>
     $(document).ready(function(){
     $("#main").hide().fadeIn(1000);
     });

     var x = Math.floor(Math.random()* 50);
     var y = Math.floor(Math.random()* 50);
     var a = Math.floor(Math.random()* 10);
     var b = Math.floor(Math.random()* 10);
     var c = Math.floor(Math.random()* 10);
     var d = Math.floor(Math.random()* 10);
     var divide =" \u00F7 "



     var problems = new Array();
     problems[0]=x+y;
     problems[1]=x-y;
     problems[2]=x*y;
     problems[3]=x/y;

     var split = new Array();
     split[0]=$("#a");
     split[1]=$("#b");
     split[2]=$("#c");
     split[3]=$("#d");

     var formula = new Array();
     formula[0] = x +" + "+ y +" = ";
     formula[1] = x +" - "+ y +" = ";
     formula[2] = x +" x "+ y +" = ";
     formula[3] = x + divide + y +" = ";

     var formrand = formula[Math.floor(Math.random()*formula.length)];
     var prorand = problems[Math.floor(Math.random()*problems.length)];
     var rand = split[Math.floor(Math.random()*split.length)];

        $("#equal").text(function myCalculation(){

              if ((formrand) == (formula[0])){
                $("#equal").text(formula[0]);
                $("#a").text(problems[0]+a);
                $("#b").text(problems[0]+b);
                $("#c").text(problems[0]+c);
                $("#d").text(problems[0]+d);
                $(rand).text(problems[0]);
                $("#a,#b,#c,#d").not(rand).click(function(){
                    $(this).transition({ opacity: 0.2, scale: 0.5});
                });
                $(rand).click(function(){
                $("#equal").text(formrand+problems[0]);
                $(rand).transition({ scale: 1.5 }).animate({"background-color":"green","color":"white"},1000);
                $("#a,#b,#c,#d").not(rand).transition({ opacity: 0.2, scale: 0.5 }).delay(2000,function(){
                    window.location.reload("index.php");
                });

                });


            }

               if ((formrand) == (formula[1])){
                $("#equal").text(formula[1]);
                $("#a").text(problems[1]+a);
                $("#b").text(problems[1]+b);
                $("#c").text(problems[1]+c);
                $("#d").text(problems[1]+d);
                $(rand).text(problems[1]);
                $("#a,#b,#c,#d").not(rand).click(function(){
                    $(this).transition({ opacity: 0.2, scale: 0.5});
                });
                $(rand).click(function(){
                $("#equal").text(formrand+problems[1]);
                $(rand).transition({ scale: 1.5 }).animate({"background-color":"green","color":"white"},1000);
                $("#a,#b,#c,#d").not(rand).transition({ opacity: 0.2, scale: 0.5 }).delay(2000,function(){
                    window.location.reload("index.php");
                });

                });

            }
              if ((formrand) == (formula[2])){
                $("#equal").text(formula[2]);
                $("#a").text(problems[2]+a);
                $("#b").text(problems[2]+b);
                $("#c").text(problems[2]+c);
                $("#d").text(problems[2]+d);
                $(rand).text(problems[2]);
                $("#a,#b,#c,#d").not(rand).click(function(){
                    $(this).transition({ opacity: 0.2, scale: 0.5});
                });
                $(rand).click(function(){
                $("#equal").text(formrand+problems[2]);
                $(rand).transition({ scale: 1.5 }).animate({"background-color":"green","color":"white"},1000);
                $("#a,#b,#c,#d").not(rand).transition({ opacity: 0.2, scale: 0.5 }).delay(2000,function(){
                    window.location.reload("index.php");
                });

                });

            }
              if ((formrand) == (formula[3])){
                $("#equal").text(formula[3]);
                $("#a").text(Math.round(problems[3]+a));
                $("#b").text(Math.round(problems[3]+b));
                $("#c").text(Math.round(problems[3]+c));
                $("#d").text(Math.round(problems[3]+d));
                $(rand).text(Math.round(problems[3]));
                $("#a,#b,#c,#d").not(rand).click(function(){
                    $(this).transition({ opacity: 0.2, scale: 0.5});
                });
                $(rand).click(function(){
                $("#equal").text(formrand+Math.round(problems[3]));
                $(rand).transition({ scale: 1.5 }).animate({"background-color":"green","color":"white"},1000);
                $("#a,#b,#c,#d").not(rand).transition({ opacity: 0.2, scale: 0.5 }).delay(2000,function(){
                    window.location.reload("index.php");
                });

                });
            }
        });






    </script>
</div>
<div data-theme="e" data-role="footer" data-position="fixed" data-inline="true">
    <h5>
        MathMap Learning
    </h5>
</div>
 </body>

4

3 に答える 3

0

「正解」の onClick イベントに関数をバインドする必要があります。

$('#idOfYourAnswer').on('click', function(){
    //Do something here
});

http://api.jquery.com/on/

于 2013-08-18T00:26:02.860 に答える
0

コールバックを使用してみてください。または、イベントが発生した後に同じ関数を再度呼び出す機能ループを使用することもできます。トレンディなように、クリック イベントを使用できます。

start();
end();
$('button').click(function () {
     start();
     end();
});

したがって、問題は最初に自動的に作成され、アプリケーションはイベントを待って新しい問題を作成します..またはそれを使用しているものは何でも。

于 2013-08-18T02:45:49.597 に答える
0

setInterval()関数のタイムアウトを設定したり、関数をボタンのクリックイベントにバインドしたりできます。

于 2013-08-18T09:25:33.970 に答える