1

我有一个 div，我在其中动态添加图像。

div.append('<img class="prod48" src="' + url + '" />');

现在url由focusout文本框设置，具体取决于其中的文本。由于 append 函数将继续追加，我应该如何更改它url而不在div? 只有在第一次focusout调用时，我才应该能够附加和休息时间来更新 url。

4

4 回答 4

3

如果要在将图像元素添加到文档后对其进行更新，则必须有某种方式来引用它。

几个想法立刻浮现在脑海：

  1. 给图像一个唯一的 ID，然后使用它：

    # First, change the html to include an id
div.append('<img id="abcdef1234" class="prod48" src="' + url + '" />');

#...
# Later, grab the image by its id and change the source url
var img = document.getElementById('abcdef1234');
img.src = newUrl;

  2. 或者，第一次动态构建图像，并将元素保存在变量中：

    # First, create an element, and hold it in a variable:
var img = document.createElement('img');
img.className = "prod48";
img.src = url;
# Now append it to the div:
div.append(img);

#...
# Later, we still have that element, so we can just change the source URL:
img.src = newUrl;
于 2013-02-13T06:19:54.000 回答
2

HTML：

<input type="text" id="url">
<div id="image_div">
    Will append image tag to this :     
</div>

查询：

$(document).ready(function(){
$('#image_div').html("<img src='' class='prod48'>");       //will replace image
    $('#url').change(function(){        
        $('.prod48').attr('src',$('#url').val());
    });
});

JSFiddle：这里

于 2013-02-13T06:29:37.370 回答
0

为图像提供一个 ID，此代码可能会对您有所帮助..

$("img").attr("src", "/img/circleGraph/circle");
于 2013-02-13T06:22:01.123 回答
0

如果您使用的是 jQuery，您可以执行以下操作：

var div = $('div');

div.append("<img src='"+url+"' />");

div.find("img").attr("src", newUrl);
于 2013-02-13T06:28:17.780 回答