如何使用 foreach 循环构建 json 对象并在 razor 中调用 jquery 函数答案

【问题标题】：How can I use a foreach loop to build json objects and call jquery functions in razor如何使用 foreach 循环构建 json 对象并在 razor 中调用 jquery 函数
【发布时间】：2011-05-31 01:02:47
【问题描述】：

我想获取一个对象列表并遍历该列表并构建一个 json 对象并在 razor 的 foreach 循环中调用一个 jquery 函数。

@foreach (var item in Model.CoordinatesObj) {
        var pinpoint = { "top": item.Top,
                "left": item.Left,
                "width": item.Width,
                "height": item.Height
            };
       $("#toPinpoint").mapImage.addPinpointExt(pinpoint);
}

我希望能够做到这一点，因此它可以动态构建此 pinpoint 对象并用于传递我的 addPinpointExt 函数。 Model.CoordinatesObj 是一个对象列表。这甚至可能吗？如果不是最好的方法是什么？

【问题讨论】：

标签： c# jquery asp.net asp.net-mvc-3 razor

【解决方案1】：

我会将 for 循环放在 MVC 操作中，然后使用 $.ajax() 调用它

$.ajax({
   url: "/Home/NewAction/id", type: "POST", 
   error : function(req,status,errorObj) { /* handle error */ }, 
   success: function(result) {
        var pinpoint = result;
        $("#toPinpoint").mapImage.addPinpointExt(pinpoint);
   }
});

使用 Razor 生成 HTML。

【讨论】：

【解决方案2】：

$("p")ToArray()

为您创建一个数组，保存每个 html 元素的值（例如“p”段落）
或者，您可以使用 each() Jquery 函数进行迭代。

【讨论】：

【解决方案3】：

如果您想将服务器端代码与纯文本（在您的情况下为 Javascript/JSON）混合，您可以将纯文本包装在 <text> 标记中：

@foreach (var item in Model.CoordinatesObj) {
    <text>
    var pinpoint = { "top": @item.Top,
            "left": @item.Left,
            "width": @item.Width,
            "height": @item.Height
        };
    $("#toPinpoint").mapImage.addPinpointExt(pinpoint);
    </text>
}

请注意，您还缺少服务器端变量前面的 @。

Phil Haack 在Razor syntax 上有一个不错的参考页面。

【讨论】：