2009-11-30 78 views
1

我有以下輸入隱藏值=「/ fr/images/findacourse_logo_tcm10-268.gif」。使用jquery替換圖像src與輸入隱藏值

<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的上面的解決方案,請建議!

謝謝。

回答

3

注意,當您更換形象是這樣的:

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

然後你目前的形象「報價電子郵件Button.JPG」已經被刪除,那麼新形象「findacourse標誌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(); 
0

這應該爲你工作:

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

我認爲'$ .attr(「值」)'沒有跨瀏覽器。 – 2009-11-30 09:52:28

+2

attr('value')是完全跨瀏覽器支持的,事實上,如果主題不是選項/選擇元素,jQuery只是返回attr值而沒有額外的處理或邏輯。波茲拉維維 – duckyflip 2009-11-30 10:06:11

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

是你需要什麼?