圖像源不錯誤地通過功能

認識我有兩個圖像：圖像源不錯誤地通過功能

<img id="img1" src="l1.jpg" usemap="#lb" height="400" border="0" width="300"> 
<img src="images.jpg" id="img2">

然後，我有一個的JavaScript：

function checkImg() { 
    if (document.getElementById('img2').src=="images.jpg") 
    { 
     if (document.getElementById('img1').src=="l1.jpg") 
     { 
      window.alert("hi"); 
     } 
    } else { 
     window.alert("bye"); 
    } 
} 
checkImg();

而激活一個按鈕：

<button type="button" onclick="checkImg()">Click Me!</button>

兩個圖像都有腳本中指定的源，儘管它仍然是a講'再見'而不是'嗨'。有什麼問題？

來源

2016-01-03 J_from_Holland

問題是'src'屬性返回一個絕對URL，而不是你剛剛設置的相對URL。 – adeneo

@adeneo哎呀...應該改變 –

@adeneo [第二篇文章]我如何使用src作爲相對URL？ –

的src屬性返回一個絕對的URL，如

<img src="image.jpg" id="element" /> 

<script> 

    element.src; // http://stackoverflow.com/image.jpg 

    element.getAttribute('src'); // image.jpg 

</script>

換句話說東西，你不得不使用getAttribute獲得src屬性的值，而不是屬性，讓你絕對的URL

function checkImg() { 

    var img1 = document.getElementById('img1'); 
    var img2 = document.getElementById('img2'); 

    if (img2.getAttribute('src') == "images.jpg") { 

     if (img1.getAttribute('src') == "l1.jpg") { 

      window.alert("hi"); 

     } else { 

      window.alert("bye"); 
     } 
    } 
} 

checkImg();

來源

2016-01-03 15:08:54 adeneo

不起作用。點擊按鈕現在不會做任何事情...... –

由於某種原因，它再次複製代碼後仍然有效。謝謝:) –

而不是使用的getAttribute功能，使用 hasattribute功能比較。然後你的按鈕將工作。

<script> 
     img1 = document.getElementById("img1"); 
     img2 = document.getElementById("img2"); 
     function checkimg() { 
     if (img1.hasAttribute("src")=="img/1.jpg") { 
      if (img2.hasAttribute("src")=="img/2.jpg"){ 
       alert("Hello"); 
      } 
     } 
     else { 
      alert("Bye"); 
     } 
     } 
    </script>

來源

2016-01-03 15:50:43

我不能讓你的代碼工作:(，並且我已經有一個沒有hasAttribute的解決方案。 –

圖像源不錯誤地通過功能

回答

相關問題