如何动态添加图像jquery

时间:2015-04-25 12:32:03

标签: jquery image

我使用以下代码动态创建img,创建了div并且工作正常。输入文本也是如此,但问题是img控件已创建但img未显示我无法找到问题所在的位置。

$.each(data.user, function (i,data) {

    $("<div>"+data.id+"  </div>").attr('id',data.id).appendTo('#page_14_14');
    $('#'+data.id).css({"border-color": "#C1E0FF", 
                        "border-weight":"1px",
                        "margin-top":"10px",                    
                        "border-style":"solid"});

    var ctrl = $('<input/>').attr({ type: 'text', name:'text', value:data.email , id:data.email, disabled:true }).addClass("text");
    $(ctrl).appendTo("#"+data.id); 
    $('#'+data.email).css({"border-color": "#C1E0FF", 
                           "width":"50px",
                           "margin-top":"10px",                    
                           "border-style":"solid"});

    var img = $('<img/>').attr({ className:"inline" , src:"/www/images/Arrow.png" }).addClass("img");

    $(img).appendTo("#"+data.id);        
});   

我也将此用于img的以下两种方法,但我遇到了同样的问题

 var img = $('<img/>', {"class" :"inline", src:"/www/images/Arrow.png"     });


 var img = $('<img class="inline" src="/www/images/bg.png" width="50px" height="50px"  />');

2 个答案:

答案 0 :(得分:0)

只需将img元素声明为字符串。

var img = '<img class="inline" src="/www/images/Arrow.png" width="50" height="50" />';

然后将它添加到div。

$('#' + data.id).prepend(img);

答案 1 :(得分:0)

我希望这会对你有帮助!

<ul id="imagesList">
  <li>No images found</li>
</ul>

$(function(){
            //load image array
            var images = {'image1':'assets/img/linkedin_30px.png','image2':'assets/img/twitter_30px.png'};
            $.each(images, function(){
               $('#imagesList').append('<li>' + this + '</li>'); 
            });
        });