Question

我需要测试如何基于返回的Json和action方法构建<a>链接，所以我创建了以下操作方法，它返回静态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变量成为对象，而不是字符串。

使用您的代码here

Answer 2

试试这个：

它正在发挥作用。检查一下：jsFiddle

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

Answer 3

你应该像这样返回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);

构建一个动作方法，返回链接数据并使用jQuery构建链接

3 个答案: