javascript - Onclick 函数在图片库中不执行任何操作

Question

我正在学习制作图片库，当我单击缩略图时，它什么也没做。以下是我的代码，我正在尝试一些书来使其工作，我可以获得一些帮助吗？HTML:

        <script src="galerijaSlika.js"></script>
        <img id="glavnaSlika" src="Slike/infogamer_galerija/info1.jpg">
        <div id="sveSlike" onClick="promjeniSliku(event)">
            <img src="Slike/infogamer_galerija/info1.jpg">
            <img src="Slike/infogamer_galerija/info2.jpg">
            <img src="Slike/infogamer_galerija/info3.jpg">
            <img src="Slike/infogamer_galerija/info4.jpg">
            <img src="Slike/infogamer_galerija/info5.jpg">
            <img src="Slike/infogamer_galerija/info6.jpg">
            <img src="Slike/infogamer_galerija/info7.jpg">
            <img src="Slike/infogamer_galerija/info8.jpg">
            <img src="Slike/infogamer_galerija/info9.jpg">
            <img src="Slike/infogamer_galerija/info10.jpg">
            <img src="Slike/infogamer_galerija/info11.jpg">
            <img src="Slike/infogamer_galerija/info12.jpg">
        </div>

Javascript:

function promjeniSliku(event){
     event = event || window.event;
     var trazeniElement = event.target || event.srcElement;
     if(trazeniElement == "IMG"){
          document.getElementById("glavnaSlika").src = trazeniElement.getAttribute("src");

     }
}

Answer 1

您的错字是:

if(trazeniElement == "IMG"){

正确的测试必须是:

if (trazeniElement.tagName == "IMG") {

详情参见 MDN

function promjeniSliku(event){
  event = event || window.event;
  var trazeniElement = event.target || event.srcElement;
  if (trazeniElement.tagName == "IMG") {
    document.getElementById("glavnaSlika").src = trazeniElement.getAttribute("src");
  }
}

<img id="glavnaSlika" src="Slike/infogamer_galerija/info1.jpg">
<div id="sveSlike" onClick="promjeniSliku(event)">
    <img src="Slike/infogamer_galerija/info1.jpg">
    <img src="Slike/infogamer_galerija/info2.jpg">
    <img src="Slike/infogamer_galerija/info3.jpg">
    <img src="Slike/infogamer_galerija/info4.jpg">
    <img src="Slike/infogamer_galerija/info5.jpg">
    <img src="Slike/infogamer_galerija/info6.jpg">
    <img src="Slike/infogamer_galerija/info7.jpg">
    <img src="Slike/infogamer_galerija/info8.jpg">
    <img src="Slike/infogamer_galerija/info9.jpg">
    <img src="Slike/infogamer_galerija/info10.jpg">
    <img src="Slike/infogamer_galerija/info11.jpg">
    <img src="Slike/infogamer_galerija/info12.jpg">
</div>