обновление источника изображения с помощью jquery не работает должным образом

Question

Я пытаюсь обновить источник изображения с помощью jquery.Для этого я вызываю функцию .load

, которая возвращает строку, которая в свою очередь будет использоваться для замены источника изображения.

srcResult значение равно new/icon.png:

<script>
 var iconLinkURL = "Users/NewIcon";
 var srcResult = $("#iconImage").children('img').load(iconLinkURL); 


  $("#iconImage").children('img').attr('src', srcResult);
</script>

HTML Side

<a id="iconImage"><img src="old/address.png"></img></a>

Что происходит, когда загружается JavaScript, изображение загружается какэто:

 <a id="iconImage"><img src="[object Object]">new/icon.png</img></a>

Я что-то упустил, следовательно, проблема сохраняется?

Answer 1

load() возвращает объект.Если вы не заинтересованы в предварительной загрузке, просто замените код следующим образом:

$("#iconImage").children('img').prop('src', 'Users/NewIcon');

Однако, если вы хотите предварительно загрузить изображение, используйте следующее:

var src = 'Users/NewIcon',
    img = new Image();

img.src = src;
img.onload = function() {
    $('#iconImage').children('img').prop('src', this.src);
};

Стоит отметить, что вам также нужно будет обернуть свой код в событие DOMReady, если вы этого еще не сделали.