0

いくつかのチェックボックスと送信ボタンのあるページがあります。私はAJAXを使用して、チェックボックスの値をPHPスクリプトcalc.phpに投稿し、データを使用していくつかの計算を実行し、結果をPHPセッション変数に割り当てます。別のPHPスクリプトjson.phpがあります。このスクリプトは、そのセッションデータを取得し、jqueryがdivに表示するためにJSONとしてエンコードします。私の問題は、送信するデータセットの量、サブ番号をユーザーが設定できるようにすることです。ユーザーがセットの数を変更すると、表示ループが同期しなくなります。

たとえば、3つのデータセットで始まる場合は、#ボタンを押して1つずつ送信します。最後のセットの後、if(count == max)が実行されます。これで、別の計算を実行し、必要に応じてデータセットの数を変更できます。2に変更すると、出力は1にリセットして#logを空にするのではなく、4になります。

$("#button").click(function() {
$.ajax({
  type: "POST",
  url: "calc.php",
  data: $("form#checkboxes").serialize(),
  success: function(data) {
    if(document.getElementById('calc').checked) {
    var max = checkboxes.subnumber.value;
    var stop = Number(max) + 1;
    count++;
    output++;
    $.getJSON('json.php', function(data) {
      $.each(data, function(key, val) {
        $('#log').append(output);
        $('#log').append(val.result);
        $('#log').append("</br>");
      })
    })
    if (count == max){
      count = 0;
      $("#results").load('results.php')
    }
if(output == stop) {
  $("#log").empty();
  output = 1;
}
}
}
})
}

簡単なことだとは思いますが、2時間ほど修正しようとしていて、問題がわかりません。他のすべては完全に機能します。正しく実行されないのは出力カウンターだけです。

4

1 に答える 1

0

JSONに対して非同期呼び出しを実行しています。ユーザーが非常に迅速に処理を行っているために呼び出しが順不同に戻っている場合、問題はそこにあります。

2つのオプションがあります。

  1. すべてのJSONを同期的に実行します(JSON呼び出しでasync:falseを使用します)
  2. カウンターを使用し、現在のインデックスに戻ってくるイベントのみを処理します。

#2の疑似コード:

var pCounter = 0;
function doSomeAjax()
{
    pCounter++;
    $.ajax('url',{
        data:{count:pCounter}
        success:function(data)
            {
                // your json should return the current counter index
                if (data.counter != pCounter) return;
                // execute normally.
            }
    });
}
于 2012-07-01T05:42:07.533 に答える