0

似乎还有其他人有类似的问题，但仍然没有找到答案。这是场景。

用户单击一个按钮，该按钮显示一个隐藏的 div，其中包含一个文本区域，他们可以在其中发表评论：

//show the div containing the textarea
$('#postTypeContainer').css({ 'display': 'block' });

接下来，用户输入评论并单击按钮提交，div 被隐藏，一些数据被发送到服务器：

$("#loading").ajaxStart(function () {
        $(this).show(); //shows a spinner
    }).ajaxComplete(function () {
        $(this).hide(); //hides the spinner

        //hide the div that was opened earlier
        $('#postTypeContainer').fadeOut('fast');
    });

    //send data
    $.ajax({
        type: "POST",
        url: rootUri + "main.aspx/StartNewThread",
        data: jsonText,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (markUp) {
           //stuff
        }
    });

这一切都正常工作。

现在用户通过单击再次打开 div，效果很好

//show the div containing the textarea
$('#postTypeContainer').css({ 'display': 'block' });

接下来，用户键入一些数据，在本例中为 @abc，因为他们想标记另一个用户，并且在“keyup”上使用 jQuery 会发生以下情况：

//ajax call to find users matching the @abc
$.ajax({
        type: "POST",
        url: rootUri + "main.aspx/GetMatch",
        data: jsonText,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (data) {

            //stuff

        }
    });

一旦这个 ajax 调用返回，打开的 div 就会关闭，就好像 DOM 被重置为 ajax 调用之前的状态一样。因此，在尝试与 textarea 交互的过程中，div 关闭了用户，这非常令人沮丧。解决此问题的唯一方法是刷新页面，这显然是我想通过使用 ajax 来避免的。希望有人知道出了什么问题。我尝试失败的一件事是，当在 keyup 上输入使 ajax 调用进行标记的函数时，我检查了 div 的状态，然后尝试在 ajax 调用结束时将其设置为保持打开状态，但事实并非如此在职的。任何帮助表示赞赏。

4

1 回答 1

1

.ajaxComplete()是一个全局 ajax 事件，每次 jQuery ajax 事件完成时触发。因此，当您的第二个 ajax 调用完成时，它也会隐藏postTypeContainerdiv。我认为您想将该隐藏绑定到第一个 ajax 调用的本地完成事件。

$("#loading").ajaxStart(function () {
    $(this).show(); //shows a spinner
}).ajaxComplete(function () {
    $(this).hide(); //hides the spinner
});

//send data
$.ajax({
    type: "POST",
    url: rootUri + "main.aspx/StartNewThread",
    data: jsonText,
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (markUp) {
       //stuff
    },
    complete: function() { // DO IT HERE

        //hide the div that was opened earlier
        $('#postTypeContainer').fadeOut('fast');

    }
});
于 2012-07-01T20:36:08.280 回答