Question

我试图在我的网站上制作新闻源。它显示所有新闻和循环所有这些，但过期的。我可以通过网页添加新闻，因此JSON可能会不断变化。 PHP脚本生成JSON，如下所示：

[
    {
    "0": "Monsieur",
    "1": "X",
    "2": "24",
    "3": "236",
    "4": "Artichauts",
    "5": "4",
    "6": "2015-06-19",
    "7": "2015-06-26",
    "8": "9",
    "9": "7",
    "nom": "Monsieur",
    "prenom": "X",
    "id_promotion": "24",
    "id_commercant": "236",
    "article": "Artichauts",
    "rubrique": "4",
    "date_debut": "2015-06-19",
    "date_fin": "2015-06-26",
    "prix_origine": "9",
    "prix_promotion": "7"
},
{
    "0": "Monsieur",
    "1": "X",
    "2": "23",
    "3": "236",
    "4": "Betteraves",
    "5": "4",
    "6": "2015-06-18",
    "7": "2015-06-25",
    "8": "8",
    "9": "6",
    "nom": "Monsieur",
    "prenom": "X",
    "id_promotion": "23",
    "id_commercant": "236",
    "article": "Betteraves",
    "rubrique": "4",
    "date_debut": "2015-06-18",
    "date_fin": "2015-06-25",
    "prix_origine": "8",
    "prix_promotion": "6"
}
]

我的jQuery脚本（试图）显示它们

$(document).ready(function () {
    function newsfeed() {
        $.getJSON("newsfeed.php", function (result) {
            var htmldata = "";
            $.each(result, function (key) {
                $("#news").html(result[key].nom + " " + result[key].prenom + " has a special offer : " + result[key].article + " at " + result[key].prix_promotion + "€ instead of " + result[key].prix_origine + "€ ").delay(5000).slideUp(300)
                    .delay(500)
                    .fadeIn(400);
            });
            x = setTimeout(function () {
                newsfeed()
            }, 5000);
        });
    }
    newsfeed();
});

所以这段代码不断输出

Monsieur X有特别优惠：Betteraves为6€而不是8€

所以我的问题是，$ .each（）函数不能像我一样工作。如果有人有想法，我会很感激。

Answer 1

循环中的

$("#news").html正在用循环元素替换#news的全部内容。

在each中创建所有html，并在完成循环后将其注入div。

    var htmldata = '' ;
    $.each(result, function(key){
        htmldata += result[key].nom + " " + result[key].prenom + " has a special offer : " + result[key].article + " at " + result[key].prix_promotion + "€ instead of " + result[key].prix_origine + "€ ";
    });
    $('#news').html(htmldata);

Answer 2

正如Swaraj所提及的那样因为.html正在替换所有内容。所以你可以使用数组推送其中的每个值然后将该数组传递给.html

var arr=[]
 $.each(result, function (key) {
         arr.push(result[key].nom + " " + result[key].prenom + " has a special offer : " + result[key].article + " at " + result[key].prix_promotion + "€ instead of " + result[key].prix_origine + "€ "));
                     });
 $("#news").html(arr);

Answer 3

自己找到答案：

    $(document).ready(function(){
var i = 0;
function newsfeed(){
$.getJSON('newsfeed.php', function(result){
    var htmldata = '';
    $.each(result, function(key){
        if(typeof result[i]=="undefined") {
            i=0;
        }
        htmldata = '<span id="news-'+ i +'">' + result[i].nom + ' ' + result[i].prenom + ' has a special offer : ' + result[i].article + ' at ' + result[i].prix_origine + '€ instead of ' + result[i].prix_promotion + '€ </span>';
    });
    $('#news')
    .html(htmldata);
    i++;
    x = setTimeout(function(){newsfeed()}, 5000);
});
} 
newsfeed();
});

无论如何，谢谢你的帮助！

$ .each（）jQuery newsfeed

3 个答案: