Замена изображения src на входное скрытое значение с помощью Jquery

Question

У меня есть скрытый ввод со значением = "/ fr / images / findacourse_logo_tcm10-268.gif".

<input type="hidden" id="Qt_Email_Image" value="/fr/images/findacourse_logo_tcm10-268.gif"/>

У меня есть другое входное изображение ниже с src = "/images/quote/Quote_Email_Button.JPG"

<tr>
    <td>
         </td>
    <td colspan="2" class="">
        <input type="image" border="0" alt="Email me this quote " src="/images/quote/Quote_Email_Button.JPG" id="Quote_btnEmail" name="Quote:btnEmail"/>
    </td>
</tr>

Теперь я хочу, чтобы во время выполнения входное изображение src заменялось на указанное выше скрытое значение и будет отображаться над изображением вместо ссылки на изображение в src. Так что мой выше HTML становится

<tr>
    <td>
         </td>
    <td colspan="2" class="">
        <input type="image" border="0" alt="Email me this quote " src="/fr/images/findacourse_logo_tcm10-268.gif" id="Quote_btnEmail" name="Quote:btnEmail"/>
    </td>
</tr>

Я хочу использовать Jquery для вышеуказанного решения, пожалуйста, предложите!

Спасибо.

Answer 1

Обратите внимание, что при замене изображения вот так:

$('#Quote_btnEmail').attr('src', $('#Qt_Email_Image').attr('value'))

Затем ваше текущее изображение "Quote Email Button.JPG" удаляется, затем загружается новое изображение "findacourse logo tcm10-268.gif" и затем отображается Поэтому, если загрузка занимает некоторое время, пользователь увидит мерцание.

Чтобы избежать этого, вы можете сначала загрузить свой «логотип findacourse tcm10-268.gif», а затем сразу же показать его пользователю:

var img = new Image();
$(img).load( function () {
    $('#Quote_btnEmail').attr('src', img.src);
});
img.src = $('#Qt_Email_Image').val();

Answer 2

$('#Quote_btnEmail').attr('src', $('#Qt_Email_Image').val());

Это то, что тебе нужно?

Answer 3

Это должно работать для вас:

$('#Quote_btnEmail').attr('src', $('#Qt_Email_Image').attr('value'))