Question

在我的应用程序中，我有一些链接的左侧菜单：

<div>
<a onclick="menuclick('user')">User(100)</a>
<a onclick="menuclick('messages')">Messages(1000)</a>
<a onclick="menuclick('contact')">Contact Us</a>
</div>

在单击每个链接时，我正在调用一个ajax，它将调用一个文件并查询表并相应地显示内容。

function menuclick(type) {
$.ajax({
    url: 'test.php',
    type: 'POST',
    data: {
        type: type
    },
    dataType: 'html',
    success: function(data) {
        $("#contentdiv").html(data);
    }
});
}

现在的问题是，如果数据库中的用户/消息数更多，则需要花费一些时间来加载内容/处理test.php文件。如果这次我单击其他一些链接，它将不会突然显示。单击每个链接后，如何立即显示内容，而无需等待其他链接ajax处理完成。

有人可以帮我找到解决方案吗？

Answer 1

我认为您应该修复您的 test.php 或提供一些加载内容，但是在此期间，这里有一个棘手的解决方案：

function menuclick(type) {
    var $el=$("#contentdiv");
    $el.data('type',type);
    $.ajax({
        url: 'test.php',
        type: 'POST',
        data: {type: type},
        dataType: 'html',
        success: function(data) {
            if ($el.data('type')==type){ // basically it checks if is the last type clicked
                $el.html(data);
            }
        }
    });
}

Answer 2

您可以在加载页面时生成div，并使点击显示它们，从而使页面花费了额外的加载时间。但这意味着您可以根据需要立即显示内容。

避免等待其他过程在Ajax中完成

2 个答案: