構建一個動作方法，返回鏈接數據並使用jQuery構建鏈接

-1

我需要測試如何構建<a>基於JSON和Action方法返回的鏈接，因此我創建了以下動作方法，它返回靜態JSON-構建一個動作方法，返回鏈接數據並使用jQuery構建鏈接

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>

但是當我運行該應用程序沒有鏈接將被建立。

來源

2012-11-18 john G

JavaScript控制檯說什麼？ – Andreas

感謝您的回覆，我檢查了使用螢火蟲返回JSON和JSON收到成功，但鏈接不構建。 –

您能否將'console.log（key，val）'的行放入'each'循環來驗證數據結構是否正確解釋？ jquery看起來很好[從這裏]（http://jsfiddle.net/TmfLP/） – kieran

試試這個：

它工作。檢查：jsFiddle

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

來源

2012-11-18 08:49:02

同樣的問題將不會顯示 –

@johnG檢查我更新的答案 –

你生成的鏈接代碼是正確的，工作的，但你應該有些東西添加到您的通話$.ajax。

供應有效 JSON使用雙引號"，而不是單引號'鑰匙和字符串值。
添加選項dataType: 'json'以便您的result變量將是一個對象而不是字符串。

工作撥弄可用代碼here

來源

2012-11-18 09:02:38 Inferpse

這將引發以下錯誤」錯誤\t 1字符文字中的字符過多「下面的var jsonText ='{」data「：」裏面的visual studio –

你不應該使用這段代碼：'var jsonText ='它只用於演示，只需用''替換'''你的JSON代碼。 – Inferpse

您應該返回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);

來源

2012-11-18 09:04:43 karaxuna

這將引發下面的錯誤「錯誤1字符文字中太多字符」下的視圖工作室「var j = new {data = [new」 –

您可以創建對象，然後將它們推送到數組。那沒問題。我只展示瞭如何去做 – karaxuna

構建一個動作方法，返回鏈接數據並使用jQuery構建鏈接

回答

相關問題