在javascript中动态添加图片显示错误

debugcn 发表于 Dev

南迪尼·德维（Nandhini Devi）

我想在代码中动态添加标签和图像。当我添加标签时，它可以正常工作，但是当我尝试添加图像时，它不起作用。

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

先生代码

引号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);

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。