Question

我已经查看了其他几个问题，并尝试了一些选项，但仍然有点遗失。

编辑 - 只是为了显示实际的AJAX呼叫......

$.ajax({
    type: 'GET',
    url: 'AJAXget/getPostcodeCheck.ashx',
    data: 'postcode=' + postcode,
    async: false,
    timeout: 10000,
    success: postcodeCallback,
    error: function () {
        alert('Sorry, there was an issue contacting the server.. please retry.');
        return;
    }
});

我有以下jQuery AJAX绑定函数，我想在其中显示正在加载的内容..

$('#' + btnID).bind('ajaxStart', function () {
    $('#' + btnID).append('<div>loading</div>');
});

这只是一个基本的例子..我确实对元素使用了一个addClass函数（#btnID是一个div），但似乎没有任何东西直接发生。

我在函数中放置了一个警告语句来测试ajaxStart是否被触发，它似乎确实是......所以我猜我缺乏DOM理解和/或jQuery是错误的！即为什么没有立即显示任何DOM更新/注入？

任何指针/想法都非常赞赏！

Answer 1

尝试编写ajaxStart方法，如下所示：

$('#' + btnID).ajaxStart(function() {
  $(this).append('<div>loading</div>');
});

另外，看看当您简化对此的jQuery Ajax调用时会发生什么：

$.get('AJAXget/getPostcodeCheck.ashx', { postcode: postcode }, function(data) {
  //$('#yourResultElement').html(data);
  console.info(data);
});

如果您正在使用Firebug（您正在使用Firebug，对吧？），请单击“控制台”选项卡，查看返回的内容。

Answer 2

我假设在用户点击按钮后调用此代码。在这种情况下，为什么不执行以下操作：

在Ajax调用之前你做：$（'＃'+ btnID）。append（'loading'）;
在成功或错误时，您执行：$（'＃'+ btnID）。remove（）;

我确信这种方法可行。

jquery不立即更新DOM？

2 个答案: