0

对不起标题；想不出一个简洁的方式来表达我的问题。我有一个小的 JQuery 脚本，可以进行两次 AJAX 调用（检索一些任意 xml）。我的问题是许多其他人似乎都遇到过的问题，但代码要简单得多。根据我的阅读，我的问题是 JQuery“点击”侦听器和其他一些进程之间的竞争条件。我尝试将代码拆分为两个单独的脚本，并使用“click”侦听器“延迟”一个（并在 HTML 正文的底部调用延迟脚本）。代码是：

function extractThread(){
    var xmlSource;
xmlSource = $(this).attr("id");
xmlSource = "xml/" + xmlSource;
$.ajax({ type: "GET", url: xmlSource, cache: false, success: function(data) {
    setUpThread(data);
        }
    });
}

pub.setup = function() {
    var target, thread, posts;
target = $("#threadList");
$.ajax({ type: "GET", url: "xml/forum.xml", cache: false, success: function(data) {
    $(target).append("<ul></ul>");
    $(data).find("thread").each(function () {
        thread = $(this).find("title")[0].textContent;
        posts = $(this).find("posts")[0].textContent;
        $(target).find("ul").append("<li><a href=\"#\" class=\"threadName\" id=\""+ posts +"\">" + thread + "</a>");
        });
    }
    });
    /* works if: alert(anyMsg); */ 
    $(".threadName").click(extractThread);
};/*end setup*/

return pub;
}());

$(document).ready(GetThreads.setup);

extractThread 调用其他任意方法的地方。我不明白为什么这里有冲突；ajax不是已经返回成功了吗？我已经阅读了许多与我相同的其他问题，但我无法应用给出的建议（可能是因为现在是早上 7 点，而且我已经起床太久了）。普遍的共识似乎是“添加 alert() 使我的代码工作”表明某些异步事件的时间存在问题......这是我第一次在 StackOverflow（或任何编程板）上发帖，并且一般来说，我对 JavaScript 很陌生，所以如果我可以做些什么来澄清我的问题，或者有人对清理我的代码有任何建议，我将非常感激。干杯，山姆。注意：“远没有那么复杂”是指我的代码，

编辑：（因为我不知道如何“+1”，或将问题标记为已解决）：感谢您的回复；没想到反应这么快。: $(document).on("click", ".threadName", extractThread); Artem 提供的解决方案完美运行，谢谢！

4

2 回答 2

1

在下面试试这个。Ajax 是异步的，因此您只能click在 Ajax 返回后调用它。因此，通过将其放入success回调中，它只会在那时运行，而不是在此之前任意运行。发出警报会停止代码执行，因此通常会给您的 Ajax 调用足够的时间来成功返回。

希望有帮助。

R。

function extractThread() {
    var xmlSource;
    xmlSource = $(this).attr("id");
    xmlSource = "xml/" + xmlSource;
    $.ajax({
        type: "GET",
        url: xmlSource,
        cache: false,
        success: function (data) {
            setUpThread(data);
        }
    });
}

pub.setup = function () {
    var target, thread, posts;
    target = $("#threadList");
    $.ajax({
        type: "GET",
        url: "xml/forum.xml",
        cache: false,
        success: function (data) {
            $(target).append("<ul></ul>");
            $(data).find("thread").each(function () {
                thread = $(this).find("title")[0].textContent;
                posts = $(this).find("posts")[0].textContent;
                $(target).find("ul").append("<li><a href=\"#\" class=\"threadName\" id=\"" + posts + "\">" + thread + "</a>");
            });
            /* works if: alert(anyMsg); */
            $(".threadName").click(extractThread);
        }
    });
}; /*end setup*/

return pub;
}());

$(document).ready(GetThreads.setup);
于 2013-08-19T19:18:49.957 回答
0

正如@rob-schmuecker 已经解释过的那样，Ajax 是异步的，因此在您附加单击事件侦听器时，您很可能还没有创建任何具有类treadName 的锚点。

但是您可以附加另一种类型的单击侦听器，该侦听器适用于即使在您添加侦听器之后创建的节点：

$(document).on("click", ".threadName", extractThread);
于 2013-08-19T19:27:19.173 回答