2016-11-05 40 views
2

我正在使用JavaScript的網站上工作。我需要Javascript才能使用外部頁面。我不太明白如何做到這一點。我的計算機上有5個文件需要能夠替換圖像文件的名稱和alt。我不能使用http。JavaScript替換img文件

我有這個圖片的代碼:

<img src="images/cablecar.jpg" width="480" height="270" alt="cable car turnaround" id="gallery" /> 

我需要使用JavaScript,而使用的onmouseover到cablecare和中高音部分更改爲新的圖像文件和說明。 我到目前爲止的代碼是 的Javascript:

 function switchPix(file, desc){ 
     var line = '<img src= asian.jpg width=\'480\' height=\'270\' alt= +desc+/>'; 
     document.getElementById("pix").write(line); 
     } 

HTML:

<figure id="pix" class="right"> 
     <script src="scripts/gallery.js"> 
     </script> 
     <img src="images/cablecar.jpg" width="480" height="270" alt="cable car turnaround" id="gallery" /> 
    </figure> 
    <ul> 
     <li><a href="http://www.asianart.org/" onmouseOver="switchPix(asian, Asian Market)">Asian Art Museum</a></li> 

我不得不使用word文件與亞洲這樣的文件名是在asian.jpg 更換纜車結束代碼是假設將鼠標放在五個鏈接中的一個上時,將頁面上的圖像更改爲另一個圖像。

對不起,如果這有點令人困惑,我真的很難理解它自己,並沒有給予足夠的信息來了解如何自己做。

回答

1

嗨嘗試使用此代碼

<figure id="pix" class="right"> 
     <script src="scripts/gallery.js"> 
     </script>   
     <img src="images/cablecar.jpg" width="480" height="270" alt="cable car turnaround" id="gallery" /> 
    </figure> 
    <ul> 
     <!-- fix onmouseover (all small case) and string parameters --> 
     <li><a href="http://www.asianart.org/" onmouseover="switchPix('asian.jpg', 'Asian Market')">Asian Art Museum</a></li> 

和JavaScript這樣的代碼工作

function switchPix(file, desc) { 
var $elm = document.getElementById("gallery"); 
$elm.src = file; 
$elm.alt = desc; 
} 
0

試試這個簡單的jQuery功能..

function switchPix(file, desc){ 
    $('#gallery').attr("src",file); 
    $('#gallery').attr("alt",desc); 
}