使用Ajax调用的while循环在javascript中不起作用

Question

我试图在javascritp中做一个基本的while循环，但是每次启动脚本时，我都会在os x中得到wheel图标。 当我按下html按钮时，将执行以下代码：

    <script type="text/javascript">
$(document).ready(function(){
    $("button").click(function(){
        myFunction();
        });
});
    var num=1;
function myFunction() {

    var c = 0;
    // Find a <table> element with id="myTable":
    var table = document.getElementById("myTable");
    // Create an empty <tr> element and add it to the 1st position of the table:
    var row = table.insertRow(-1);
    // Insert new cells (<td> elements) at the 1st and 2nd position of the "new" <tr> element:
    var cell1 = row.insertCell(0);
    var cell2 = row.insertCell(1);

while(num != 5)
{
    $.ajax({
            type: 'get',
            url: 'controller/script.php',
            type: "POST",
            data: (
            {
                name: 'Alfro',
                surname: 'McDohl',
                num: num
            }),
            success: function(data) 
            {                
                $("p.polla").text(data);
                var result = $.parseJSON(data);
                // Add some text to the new cells:
                cell1.innerHTML = result[0];
                cell2.innerHTML = result[1];
                num = result[2];
            },
            error: function()
            {
                alert('error');
            },
        });
    }           
}

这是script.php的PHP代码：

<?php

$name = $_POST['name'];  
$surName = $_POST['surname'];
$num=$_POST['num'];
$num++;
if ($_POST['num']>=10){
    echo json_encode(array($name.$c++, $surName.$c++,'0'));
}
else{
    echo json_encode(array($name.$c++, $surName.$c++,$num));
}
?>

这样做的意思是因为我想从数据库中加载数据，但是检索所有信息花费了太多时间，所以我想通过ajax调用显示一个结果，然后继续检索数据库以显示另一个结果， “一个一个”，为此，我需要使用while循环，因此我正在使用while循环，但是我无法使其正常工作。

Answer 1

不要使用while循环。 您的Ajax调用是异步发生的，因此while循环永远不会更改n的值。 因此，删除循环并将条件放入Ajax成功块中，然后从那里再次调用myFunction(num) 。

success: function(data) 
            {                
                $("p.polla").text(data);
                var result = $.parseJSON(data);
                // Add some text to the new cells:
                cell1.innerHTML = result[0];
                cell2.innerHTML = result[1];
                num = result[2];
                myFunction(num);
            },