Question

在将成功HTML设置为div之前，我需要5秒的延迟。我在下面试过，但它没有用。有人有想法吗？

$("#glyphicon-chevron-left-daily").click(function () {
    var endDate = $("#DailyViewButtonOk1").data("date");
    var previousButtonHtml = $(this).html();
    $(this).html("<span class=\"glyphicon glyphicon-refresh\"></span>");

    $(function () {
        callAjax();
    });

    function callAjax() {
        $.ajax({
            url: loadUrl,
            type: 'POST',
            load: "<img src='img/load.gif' alt='loading...' />",
            data: { startDate: startDate, endDate: endDate },

            success: function (response) {
                $("#_DailyViewResults").html(response);
                $("#_DailyViewResults").show();
                setTimeout(callAjax, 5000);
            },
            error: function () {

            }
        });
    }
    $(this).html(previousButtonHtml);
});

所以下面的代码现在有效。现在的问题是，按钮中的原始范围未恢复。

$("#glyphicon-chevron-left-daily").click(function () {
    var endDate = $("#DailyViewButtonOk1").data("date");
    var previousButtonHtml = $(this).html();
    $(this).html("<span class=\"glyphicon glyphicon-refresh\"></span>");
    $.ajax({
        url: loadUrl,
        type: 'POST',
        data: { startDate: startDate, endDate: endDate },

        success: function (response) {
            setTimeout(function (response) {
                $("#_DailyViewResults").html(response);
                $("#_DailyViewResults").show();
                $(this).html(previousButtonHtml);
            }, 1000, response);
        },
        error: function () {

        }
    });
});

Answer 1

$("#glyphicon-chevron-left-daily").click(function () {
    var endDate = $("#DailyViewButtonOk1").data("date");
    var previousButtonHtml = $(this).html();
    $(this).html("<span class=\"glyphicon glyphicon-refresh\"></span>");
    var that = this;

    $.ajax({
        url: loadUrl,
        type: 'POST',
        load: "<img src='img/load.gif' alt='loading...' />",
        data: { startDate: startDate, endDate: endDate },

        success: function (response) {
            var params = [];
            params['response'] = response;
            params['previousButtonHtml'] = previousButtonHtml;
            params['that'] = that;

            setTimeout(function(params) {
                $("#_DailyViewResults").html(params['response']);
                $("#_DailyViewResults").show();
                $(params['that']).html(params['previousButtonHtml']);
            }, 5000, params);
        },
        error: function () {
        }
    });

});

Answer 2

我认为案例是ajax，它正在执行success函数，在其上下文中没有callAjax，因此callAjax被提升为undefined。

success: function (response) {
                    $("#_DailyViewResults").html(response);
                    $("#_DailyViewResults").show();
                    console.log('callAjax=', callAjax);
                    setTimeout(callAjax, 5000);
                },

您可以通过从ajax的回调中登录到callAjax的控制台值来轻松检查事物。

解决方案是在上下文中保留callAjax函数，如：

//in ajax call's properties object
success: (function(callAjax) { return function (response) {
    $("#_DailyViewResults").html(response);
    $("#_DailyViewResults").show();
    setTimeout(callAjax, 5000);
}})(callAjax),
error: //...

在ajax调用中设置延迟不起作用

2 个答案: