JSON文件中的超鏈接URL值

如何在表格中顯示時將我的JSON文件中的URL值設置爲超鏈接？JSON文件中的超鏈接URL值

JSON

{ 
    "one": "http://urltovideo.mp4", 
    "two": "The second list item", 
    "three": "The third list item" 
}

jQuery的

$.getJSON("test.json", function(data) { 
    var items = []; 
    $.each(data, function(key, val) { 
    items.push("<div class='panel panel-default'><div class='panel-heading'>" + key + "</div><div  
    class='panel-body'><a href=''>" + val + "</a></li></div></div>"); 
    }); 

    $("<ol/>", { 
    "class": "my-new-list", 
    html: items.join("") 
    }).fadeIn(900).appendTo("body"); 
});

來源

2014-09-05 Matt

你只需要更緩慢地走一點點就行items.push。也許你想在這之前有一個if語句來分離出超鏈接？ – ControlAltDel 2014-09-05 14:30:47

[是不是那些超鏈接已經？]（http://jsfiddle.net/1L7hf6L5/） – 2014-09-05 14:39:52

您需要檢查是否val是包含一個鏈接：

$.each(data, function(key, val) { 
    var link = (val.indexOf('http') > -1) ? '<a href="' + val + '">' + val + '</a>' : val; 

    items.push('<div class="panel panel-default"><div class="panel-heading">' + key + '</div><div  
    class="panel-body">' + link + '</li></div></div>'); 
    });

而且，更乾淨的代碼，你應該使用"爲HTML屬性如class="..."和' f或JavaScript字符串，如：'<a href="' + val + '">'

見jsFiddle

來源

2014-09-05 14:31:10

我可以看到如何工作，但它的返回undefined作爲顯示的值和URL值。 – Matt 2014-09-05 14:40:39

@Matt我加了一個小提琴，應該可以工作 – 2014-09-05 14:45:49

這很有效，謝謝！ – Matt 2014-09-05 14:52:50

JSON文件中的超鏈接URL值

回答

相關問題