Javascript 使用JSON用jQuery填充UL

这是我的JSON数据

[
    {"CountyId":2,"Name":"Snohomish","StateId":1,"State":null,"Plans":null},    
    {"CountyId":1,"Name":"Whatcom","StateId":1,"State":null,"Plans":null}
]

我正试图用这些数据在我的网页上填充UL

function loadSavedCounties() {
    $.post("/Plans/GetPlanCounties/",
        { planId: $("#PlanId").val() },
        function (data) {
            populateSavedCounties($("#SavedCounties"), data);
        }
    );
}
function populateSavedCounties(select, data) {
    select.html('');
    var items = [];
    $.each(data, function (id, option) {
        items.push('<li>' + option.Name + '</li>');
    });  
    select.append(items.join(''));
}

函数loadSavedCountes（）{
$.post（“/Plans/GetPlanCountries/”，
{planId:$（“#planId”）.val（）}，
功能（数据）{
填充SavedCountes（$（“#SavedCountes”）、数据；
}
);
}
函数populateSavedCountes（选择，数据）{
select.html（“”）；
var项目=[]；
$.each（数据、函数（id、选项）{
items.push（“
”+option.Name+”
）；
});  
select.append（items.join（“”））；
}

我知道我正在成功调用

loadsavedquerys（）

，因为我的UL正在被

select.html（“”）

调用清除。但没有任何物品被放回UL

更新。。。

---

在明显的修复和更改无效后，我发现控制器中存在一个问题，该问题没有抛出错误，但基本上返回空的JSON对象。一旦我发现了这一点，数据开始向下流动，建议的更改就起到了作用。

您可以在最后设置UL的html-无需先清除：

function populateSavedCounties(select, data) {
    var items = [];
    $.each(data, function (id, option) {
        items.push('<li>' + option.Name + '</li>');
    });  
    select.html(items.join(''));
}

函数填充存储帐户（选择，数据）{
var项目=[]；
$.each（数据、函数（id、选项）{
items.push（“
”+option.Name+”
）；
});  
select.html（items.join（“”））；
}

这很简单，我将首先编写代码，然后尝试返回并解释

脚本

//您显然知道如何使用.post
$.post（“/Plans/getPlanCountries/”，{planId:$（“#planId”）.val（）}，函数（数据）{
//出于简单起见，我没有创建单独的函数，但是您似乎知道如何移动函数
//当然，下面我只是简单地为您想要的元素分配一个可重用的变量
var$this=$（“#SavedCounties”）.empty（）；
//而不是。每个，我的前提是你的数据完全按照上面所说的返回，
//在这种情况下，简单的陈词滥调是最容易的
对于（数据中的x）{
//这非常简单，第一部分创建列表元素的jQuery对象
//文本部分也将文本添加到其中（又名，您想要的html）
//最后一部分将Li附加到UL的末尾
$（“
”）text（数据[x].Name）.appendTo（$this）；
};
});

没有评论的最终结果，非常简短和甜蜜

$.post（“/Plans/getPlanCountries/”，{planId:$（“#planId”）.val（）}，函数（数据）{
var$this=$（“#SavedCounties”）.empty（）；
对于（数据中的x）{
$（“
”）text（数据[x].Name）.appendTo（$this）；
};
});

您需要一个

$（选择）.listview（“刷新”）

你确定

数据
是数组而不是字符串吗？在
populateSavedCounties
中，将此作为第一行：
控制台.log（数据类型）
并让我们知道它是什么。相同的结果，一个空
集。我看到。。。我现在开始怀疑我是不是因为某种原因没有得到数据……你的改变确实奏效了。我没有发布我尝试做的全部功能，实际上在上游有一个错误，阻止JSON请求成功完成。一旦我修正了它，修改了你展示的最后一行，就成功了。谢谢您可能不想对数组使用“for…in”循环。如果您加载的任何库向数组原型添加了任何内容，那么该循环也会对其进行迭代（而不仅仅是数组中的项）…每个库都是函数的奇葩，这是一个愚蠢的说法，如果您有库向回发中添加数据，那么您需要知道如何评估这些添加，否则，回看你的帖子。由于回发通常是某种回音，因此确保数据的完整性并不难。我这么做已经很多年了，从来没有发现不在json数据上使用简单for语句的理由。@SpYk3HH：我只是指出，在数组上使用“for I”循环比使用“for…in”循环更好，尤其是在您可能不知道（或不知道）Array.prototype是否已被其他源修改的情况下。个人观点，如果你有一个库可以修改你的基本javascript方法，把它扔了吧！这只是我个人的观点，但在“图书馆”里做这样的修改是鲁莽和无知的。此外，这仍然不能消除编码人员知道如何解释这种情况的能力。我个人认为I循环是过时的，容易出现故障。它的个人偏好，但每个人都有自己的偏好。更不用说，当for-in是简单、容易和简短的时候，for-in可能会很长很长！我喜欢短发
// You obviously know how to use .post
$.post("/Plans/GetPlanCounties/", { planId: $("#PlanId").val() }, function(data) {
    // out of simplicity, i did not create a seperate function, however you seem to know how to move functions around
    // below of course i simply assign a variable for reuse to the element you want
    var $this = $("#SavedCounties").empty();
    // instead of .each, I went on the premise that your data is returned exactly as stated above,
    // in which case, a simple old school for statement is easiest
    for (x in data) {
        // this is real simple, the first part creates a jQuery object of a List Element
        // the text part adds the text too it (aka, html you were wanting)
        // the last part appends the Li to the END of the UL
        $("<li />").text(data[x].Name).appendTo($this);
    };
});

$.post("/Plans/GetPlanCounties/", { planId: $("#PlanId").val() }, function(data) {
    var $this = $("#SavedCounties").empty();
    for (x in data) {
        $("<li />").text(data[x].Name).appendTo($this);
    };
});