如何在jQuery中輸出圖像鏈接append

我已經創建了一個圖像庫網格並試圖輸出圖像。我試圖將路徑放入var thumb ="path";，然後將它連接到json_data，但無法讀取圖像的路徑。有任何想法嗎？如何在jQuery中輸出圖像鏈接append

function ajaxfunction(json_data){ 
    var path = "images/products/shirts/smallthumbs/"; // path to image 
    var url = "#"; 

    var table = $("<table></table>"); 
    var tr = $("<tr></tr>").appendTo(table); 
    for (var i = 0; i < json_data.length ; i++){ 
     if (i %4==0) 
      tr = $("<tr></tr>").appendTo(table);    
     $(tr).append("<td>"+json_data[i].prod_name+"<br/>"+ 
      " " + "<a href="+url+"><img src="+path+json_data[i].pic"/></a>"+"<br/>"+ //attempting output 
      "\u00A3"+json_data[i].price+"</td>"); 
    } 

    $("#maindisplay").append(table); 
}

來源

2013-04-04 chucky

什麼不起作用？ – Blender 2013-04-04 21:57:38

您是否嘗試將鏈接粘貼到地址欄中，因爲它會在生成的html上呈現，以查看圖像名稱或路徑是否有錯誤？ – Nate 2013-04-04 22:00:45

該功能不顯示圖像。我已經在上面的例子中嘗試添加圖像的路徑。 – chucky 2013-04-04 22:01:30

此行$(tr).append("<td>"+json_data[i].prod_name+"<br/>"+ " " + "<a href="+url+"><img src="+path+json_data[i].pic"/></a>"+"<br/>"+ //attempting output "\u00A3"+json_data[i].price+"</td>");

需要用適當的引號將s trings（最好是使用'爲JavaScript字符串所以你可以使用"在HTML屬性：

$(tr).append('<td>' + json_data[i].prod_name + '<br/>' + 
    ' ' + '<a href="' + url + '"><img src="' + path + json_data[i].pic + '"/></a>' + '<br/>' + //attempting output 
    '\u00A3' + json_data[i].price + '</td>');

此外，這是不是很有效，有多次調用.appendTo()。您應該一次生成HMTL元素，而不是多個.append()調用。

來源

2013-04-04 22:00:42 sweetamylase

感謝sweetamylase。目前這種方法可行，效率會更高嗎？ – chucky 2013-04-04 22:21:46

@chucky請參閱相關問題：http://stackoverflow.com/questions/5422169/in-jquery-how-to-efficiently-add-lots-of-elements – sweetamylase 2013-04-04 22:28:39

括起來src屬性的內容（這是你的路徑數據）對單引號，所以更換你的下面的代碼：

... +"><img src="+path+json_data[i].pic"/></a>"+ ...

這一個：

... +"><img src='"+path+json_data[i].pic"'/></a>"+ ...

來源

2013-04-04 22:00:05 Nelson

如何在jQuery中輸出圖像鏈接append

回答

相關問題