jquery - 构建返回链接数据的操作方法并使用 jQuery 构建链接

Question

我需要测试如何<a>基于动作方法返回的 Json 构建链接，因此我创建了以下返回静态 JSON 的动作方法-

public ActionResult statisjson(int start = 0, int rows = 50)
        {
string j = "{'data': [{'url': 'http://192.168.10.50/WCF?imgid=1', 'desc': 'firstdoc'},{'url': 'http://192.168.10.50/WCF?imgid=2', 'desc': 'firstdoc'},{'url': 'http://192.168.10.50/WCF?imgid=3', 'desc': 'firstdoc'}]}";
return Content(j, "application/json");

        }

然后我可以定义以下脚本来构建链接：-

$(document).ready(function getstaticjson() {




            $.ajax({
                type: 'GET',
                url: 'http://localhost:1431/Home/statisjson',
                dataType: 'json',

                success: function (result) {

                    $.each(result.data, function (key, val) {


                        $("<a>" + val.desc + "</a>").attr("href", val.url).appendTo("#links123");

                    });
                }
            });


        });
<div id="links123"></div>

但是当我运行应用程序时不会建立任何链接。

Answer 1

您生成链接的代码是正确且有效的，但您应该在$.ajax调用中添加一些内容。

• 使用双引号而不是单引号为键和字符串值提供有效的JSON 。"'

• 添加选项dataType: 'json'，以便您的result变量将是一个对象而不是字符串。

在这里使用您的代码

Answer 2

你应该像这样返回 JSON（我没有测试过代码）：

public ActionResult statisjson(int start = 0, int rows = 50)
    {
         var j = new { data = [new {url = 'http://192.168.10.50/WCF?imgid=1', desc = 'firstdoc'},...] };
         return Json(j, JsonRequestBehaviour.AllowGet);
    }

或者您应该解析结果（因为您正在从操作返回字符串）：

var data = JSON.parse(result);

Answer 3

尝试这个：

这是工作。检查这个：jsFiddle

var a = '<a ' + 'href="' + val.desc + '" >' + val.url + '</a>';
$("#links123").html(a);