Question

我创建了一个图库图形网格并尝试输出图像。我试图将路径放在var thumb ="path";中，然后将其连接到json_data，但无法读取图像的路径。有什么想法吗？

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);
}

Answer 1

将src属性内容（即您的路径数据）包含在单引号中，因此请替换以下代码：

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

这个：

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

Answer 2

这一行$(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>");

需要使用正确的引号分隔字符串（最好使用'用于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()次调用。

如何在jQuery中输出图像链接

2 个答案: