javascript - 动态添加 <Img> 标签

Question

最初，我的图像容器 div 是:

<div id="offer_image" class="img_preview_container" />
<a class="preview_overlay"></a>
</div>

然后执行:

$('#image_upload_form input').change(function() {

    if ( $(this).val() == '') return false;

    $('#image_upload_form').ajaxSubmit({
        success: function ( data ) { 
            if ( (/^http:\/\//).test(data) ) {
                $('#offer_detail input[name=image]').val(data);
                myImage = new Image();
                myImage.src = data;
                $(myImage).load(function() {
                    $('#offer_image').updateimgto(myImage.src);
                });
            }
            else {
                $('<div></div>').html(data).dialog({ title: 'Unable to upload your image' });
            }
        },
    });

});

当 JavaScript 代码执行时，会出现 <img>标签添加到原始图像容器div:

<div id="offer_image" class="img_preview_container" />
    <a class="preview_overlay"></a>
    <img src="http://www.test.com/pic1.png", alt="uploaded img">
</div>

我不确定标签<img>到底在哪里正在添加中。是吗:

1. $('#offer_image').updateimgto(myImage.src) ？
2. 我输入myImage.title="my pic"在 JavaScript 中，但它并没有添加到 <img>标签输出。为什么？

Answer 1

1. 很可能在 updateimgto 函数中，需要查看它才能确定。

2. 调用 updateimgto 后尝试添加
   $('#offer_image img').attr('title','我的图片');
   
   这应该有助于澄清此时图像是否已添加到 DOM 中并更新标题。