jquery .each 函数之后不执行任何代码

No code is executed after jquery .each function

本文关键字：执行 任何 代码 之后 each 函数 jquery      更新时间：2023-09-26

正如我上面所说，在我的.each函数之后不会执行任何代码。我以为每个代码都会在每个函数准备就绪后执行？！

这是我的js文件：

function onUploadLoad() {
    $.ajax({
        type: "POST",
        url: "headlines_getter.php",
        dataType: 'json',
        cache: false,
        success: function (data1) {
            console.log("debug 2");
            var i = 0;
            var $element = "";
            $.each(data1[i].main, function () {
                console.log("debug 3 ");
                $element += '<div data-role="collapsible"><h3>' + data1[i].main + '</h3>';
                var j = 0;
                $.each(data1[i].sub, function () {
                    console.log("debug 4");
                    $element += '<span><input type="checkbox" name="headlines" data-mini="true" value="blub" /> ' + data1[i].sub[j] + ' </span>';
                    j++;
                });
                $element += '</div>';
                i++;
                var $elements = $($element).appendTo($('#headlinesgroup'));
                $elements.collapsible();
            });
    alert("ok"); // <- this alert is not shown!!
    console.log("debug 12"); // <- also not this console.log!
        }
    });
}

如果我在每个功能之前发出警报，一切正常？！

提前谢谢。最好的问候，约翰。

代码中的这一行：

$.each(data1[i].main, function () {

说要遍历data1[i].main的属性/元素。也就是说，假设此时i为 0，它期望 data1[0] 的 .main 属性是数组或对象。鉴于您尝试在循环中继续使用data1[i].main并且您自己i递增的方式，我怀疑.main根本不是数组或对象，因此您的$.each()循环都不像您认为的那样工作。

只是在这里猜测，但您的data1数据的结构实际上是这样的：

[
   { "main" : "some heading 1", "sub" : [ "item1", "item2", "item3" ] },
   { "main" : "some heading 2", "sub" : [ "item1", "item2", "item3" ] },
   { "main" : "some heading 3", "sub" : [ "item1", "item2", "item3" ] }
]

该结构对应于您似乎试图在$.each()循环中执行的操作，但是尝试在单独管理自己的i和j循环计数器的同时使用$.each()就出错了。您想使用$.each()或传统的for循环，但就像您试图同时执行这两项操作一样。假设上述结构与您的结构相似，您需要执行以下操作：

    success: function (data1) {
        console.log("debug 2");
        var $element = "";
        $.each(data1, function (i, currentObj) {
            console.log("debug 3 ");
            $element += '<div data-role="collapsible"><h3>' + currentObj.main+ '</h3>';
            $.each(currentObj.sub, function (j, currentSub) {
                console.log("debug 4");
                $element += '<span><input type="checkbox" name="headlines" data-mini="true" value="blub" /> ' +currentSub + ' </span>';
            });
            $element += '</div>';
            var $elements = $($element).appendTo($('#headlinesgroup'));
            $elements.collapsible();
        });
        alert("ok"); 
        console.log("debug 12");
    }

请注意，在$.each()这两个循环中，我实际上都没有使用i和j变量，因为jQuery将currentObj设置为等于data1[i]并且还将currentSub设置为等于currentObj.sub[j](这也是data1[i].sub[j](。

如果你去看 .each(( 的文档，你可以看到回调函数的原型需要两个参数

jQuery.each( collection， callback(indexInArray， valueOfElement( (

因此，您可以这样做：

$.each(data1[i].main, function (index, element) {
//code inside each
});

尝试将error参数添加到$.ajax请求中，如下所示：

function onUploadLoad()
{
    console.log("debug start");
    $.ajax({
        type: "POST",
        url: "headlines_getter.php",
        dataType: 'json',
        cache: false,
        success: function (data1) {
            console.log("debug success");
        },
        error: function() {
            console.log("debug error");
        }
    });
    console.log("debug end");
}​

既然问题变了...

你能在这里发布你的 php 的回应吗？看看你是否在操纵data1必须纵的方式......

相关文章：