Question

我正在尝试通过返回JSON数组的PHP脚本收集数据后将HTMl内容附加到div中。我成功地将返回的数据解析为具有我需要的所有内容的字符串var，但它第一次不能工作。检查变种与firebug和所有加载和解析确定。有人可以帮忙吗？下面是完整代码的示例：第一个函数从php脚本加载数据......

function LoadProds(idf){
if (idf){
    request = '../controllers/returnprods.php?idfamilia='+idf;

    $.getJSON(request,function(data){
    if (!data.resultado){
    nProds = data.length;

    for (i = 0; i < nProds; i++){
        htmlContent = '<div class="cartigo">\n <div class="cartigodetalhe">';
        h1Content = ' <h1>'+data[i].nome+'</h1>'
        h2Content = '<h2>'+data[i].preco+'€</h2> \n</div>'
        imgContent = '<img src="images/products/'+data[i].fullpath+'" width="183px"    height="87px"> \n </div>';

        divproduto = htmlContent+h1Content+h2Content+imgContent;
        sProdutos = sProdutos + divproduto;
    }
    ncurrPos = 0;
}
}); 

}else{
return "(empty)";
}
}

第二个，使用click（）事件加载已解析的数据并更改外观

$(".cbotaogrande").click(function(){
activeid = "#"+$('img[src$=".png"]').attr("id");
if (activeid){
    activeimg = $(activeid).attr("src");
    activeimg = activeimg.substr(0,activeimg.length - 7)+".jpg";
    $(activeid).attr("src", activeimg);
}
activebtn = $(this).attr("id");
activebtn ="#img"+activebtn.substr(4);
tmpsource = $(activebtn).attr("src");
$(activebtn).attr("src",tmpsource.substr(0,tmpsource.length-4)+"_on.png");

activebtn = "cgradiente"+activebtn.substr(4);

$(".cbotoestopo").attr("id",activebtn);
$(".clogo").attr("id",activebtn);

LoadProds($(this).attr("comment")); // Calls the load data function above...


$(".cartigo").remove();  // Remove divs existentes com produtos
if (sProdutos != ''){
    $("#cprodutos").append(sProdutos); 
    sProdutos = '';
}else{
    sProdutos = '';
}

});

希望你能帮助我。提前致谢

Answer 1

您需要包含以下代码部分：

$(".cartigo").remove();  // Remove divs existentes com produtos
if (sProdutos != ''){
    $("#cprodutos").append(sProdutos); 
    sProdutos = '';
}else{
    sProdutos = '';
}

在LoadProds()的回调中的$.getJSON()函数中

。

$.getJSON()进行异步调用以获取数据。这意味着您的javascript代码将不会停止并等待此操作完成，然后再继续下一行。因此，在您的原始代码中，在调用LoadProds()之后，它将立即进入下一个if块，然后才能获取数据并设置变量。这就是为什么它似乎第二次工作，因为当你再次尝试再次点击时，数据已被加载。

jQuery append（）无法正常工作，只是第二次

1 个答案: