Question

我想在我的代码中动态添加标签和图片。当我添加标签时它的工作正常，但是当我尝试添加image.its无效时。

 for(var i=0;i<output.length;i++){
 var shopname=$("<label id="+output[i].branch_id+">"+output[i].myfavourite+"</label>");
 var shopimage=$("<img id="+output[i].image+" float="left" width="100px"/>");
 $("#id").append(shopname).append(shopimage);
 }

Answer 1

float="left"和width中的引号是问题，因为您使用双引号来包装字符串。你可以像这样逃避它们：

var shopimage=$("<img id="+output[i].image+" float=\"left\" width=\"100px\"/>");

虽然你应该在CSS中设置float，而不是属性：

var shopimage=$("<img id="+output[i].image+" width=\"100px\" style=\"float:left\" />");

整个代码可以更好地处理对象而不是HTML字符串：

var shopname = $("<label></label>")
                   .prop("id", output[i].branch_id)
                   .text(output[i].myfavourite);

var shopimage = $("<img />")
                   .prop("id", "someid")
                   .prop("src", output[i].image)
                   .css({
                       width : '100px;',
                       float: 'left'
                   });

$("#id").append(shopname).append(shopimage);

在JavaScript中动态添加图像显示错误

1 个答案: