浏览器在运行Ajax时冻结/挂起

时间:2014-09-17 03:57:09

标签: jquery ajax

我在网上搜索但仍无法找到问题的解决方案。每当我运行我的函数时,我的浏览器都会挂起或冻结,直到函数getwidgets()完全加载。我的功能如下。

var offset = -1;
var uniqueRandoms = [];
var numRandoms = 6;
function makeUniqueRandom() {
    // refill the array if needed
    if (!uniqueRandoms.length) {
        for (var i = 0; i < numRandoms; i++) {
            uniqueRandoms.push(i);
        }
    }
    var index = Math.floor(Math.random() * uniqueRandoms.length);
    var val = uniqueRandoms[index];

    // now remove that value from the array
    uniqueRandoms.splice(index, 1);
    return val;
}

function getwidgets(){
    $('#loading_message').fadeIn(100);
    offset = offset + 1;
    for (var i = 0; i < 6; i++) {
        (function(i){
            setTimeout(function(i){
                var rand_no = makeUniqueRandom();
                $.ajax({
                    type: "POST",
                    url: "../ajax/widgets.php",
                    data: "offset="+offset+"&select="+rand_no,
                    dataType: "html",
                    success: function(html){
                        var firstcol = $('#first_column').outerHeight();
                        var secondcol = $('#second_column').outerHeight();
                        var thirdcol = $('#third_column').outerHeight();
                        if(firstcol<secondcol && firstcol<thirdcol)
                            $('#first_column').append(html).fadeIn(300);
                        else if(secondcol<thirdcol && secondcol<firstcol)
                            $('#second_column').append(html).fadeIn(300);
                        else
                            $('#third_column').append(html).fadeIn(300);
                    },
                    complete: function(){
                        $('#loading_message').fadeOut(300);
                    }
                });
            }, 0)
        })(i);
    }
}

每次运行getwidgets()函数时,我的浏览器都会挂起,直到完全加载。我怎么知道这个?注意$('#loading_message')。fadeIn(100)?浏览器挂起或冻结时会出现此消息。然后它在ajax完成加载时消失。如何在后台加载Ajax?

我的widgets.php是这样的......只是一个例子,你明白了......

<?
require('../inc/config.php');
$offset = $_POST['offset'];
$select = $_POST['select'];
?>

<? if($select == 0 && $offset % 2 == 0){ ?>
<?  $sql_stmt = "SELECT id, name, address, address_2, city, postcode, date_created FROM locations ORDER BY date_created DESC LIMIT 1 OFFSET ".$offset."";
    $sql = mysqli_query($con, $sql_stmt) or die(mysqli_error($con));
    $row = mysqli_fetch_assoc($sql);
    if($row){
?>
    <div id="new_hotspot" class="count_div">
        Return data back to main...
    </div>
<? }} else if($select == 1){ ?>
some divs here......
<? } ?>

我的php会返回一个包含数据库中所选数据的整个div。我怀疑我的数据太大而且加载速度很慢。

但是如何让它在后台加载呢?

0 个答案:

没有答案