JavaScript变量空没有事先警告的messge

我使用下面的函数来创建从JSON-文件的链接列表，并把它们放入一个span元素（jQuery的已被初始化）JavaScript变量空没有事先警告的messge

$(document).ready(function() { 

function createjson(category) { 
     var content = ""; 
    i = 0; 
    $.getJSON(category + ".txt", function(data){ 
     while(data[i] != null) { 
      content = content + '<li class="liste"><a target="_blank" class="liste" href="' + data[i].url + '">' + data[i].name + '</a></li>'; 
      i++; 
     } 

    }); 
    document.getElementById("list_" + category).innerHTML = content; 
} 

createjson("cat1"); 

});

然而，如果我像这样使用它，span元素保持空白。只有当我更换

document.getElementById("list_" + category).innerHTML = content;

与

alert("test"); 
document.getElementById("list_" + category).innerHTML = content;

，我得到所需的输出。我怎样才能得到它没有事先打印出一条警告消息？

来源

2012-11-09 helm

把html append放在回调中，当回调开始时也重置i。

$(document).ready(function() { 

function createjson(category) { 

    $.getJSON(category + ".txt", function(data) 
    { 
     var content = ""; 
     for(i=0; i<data.length; i++) 
     { 
      content = content + '<li class="liste"><a target="_blank" class="liste" href="' + data[i].url + '">' + data[i].name + '</a></li>'; 
     } 
     document.getElementById("list_" + category).innerHTML = content; 
    }); 

} 

createjson("cat1"); 

});

来源

2012-11-09 10:18:00

感谢您的解决方案，它工作得非常好。 – helm

随时掌舵:) –

这是因为.getJSON()是一种异步方法。您的代码将尝试在服务器有时间响应请求之前使用内容更新DOM。因此没有插入内容。

有了警报，您可以停止执行足够长的时间以便服务器响应，因此它在添加警报时起作用。

做这将是你的内容更新移动到成功回调相反，这始终是运行在服务器响应后，正确的方法：

$.getJSON(category + ".txt", function(data){ 
    while(data[i] != null) { 
     content = content + '<li class="liste"><a target="_blank" class="liste" href="' + data[i].url + '">' + data[i].name + '</a></li>'; 
     i++; 
    } 

    $("#list_" + category).html(content); 
});

我和稍短的jQuery代替你document.getElementById("list_" + category).innerHTML = content;在上面的例子中也相当于$("#list_" + category).html(content);。

来源

2012-11-09 10:16:37

除了仅在访问回调DIV ，请将您的Dom访问权限更改为jquery。 – mplungjan

@mplungjan当然，更新我的例子。谢谢！ –

这导致了我没有被重置的问题，所以我将您的解决方案与Waqar Alamgir的解决方案结合在一起，并且工作正常。非常感谢。 – helm

使用此!==与不等于比较NULL

while(data[i] !== null) { 
      content = content + '<li class="liste"><a target="_blank" class="liste" href="' + data[i].url + '">' + data[i].name + '</a></li>'; 
      i++; 
     }

来源

2012-11-09 10:18:39

这应该是'typeof data [i]！''undefined'，因为它似乎代码利用了'null == undefined'的事实。此外，这并不能解决问题中的问题 – Rowan

这不是这是解决这个警报，警报基本上阻塞UI足够长的时间为AJAX请求完成。

$.getJSON是一种异步方法。这意味着该函数调用的结果立即并非总是可用，您需要将您的代码设置$.getJSON回调内部列表元素HTML：

$.getJSON(category + ".txt", function (data) { 
    while(data[i] != null) { ... } 
    document.getElementById("list_" + category).innerHTML = content; 
});

来源

2012-11-09 10:21:29 Rowan

JavaScript变量空没有事先警告的messge

回答

相关问题