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

＆＃13;

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

＆＃13;

<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>

＆＃13;

Answer 2

我得到了这个工作。我不得不改变周围的图像，并且为了在galeria图像中获得更大的项目，我必须更换字符串，随意删除该部分。

＆＃13;

function promjeniSliku(event) {
  var target = event.target;
  if (target.tagName == 'IMG') {

    var src = target.src.replace(/100/g, '500');
    document.getElementById('glavnaSlika').src = src;
  }

}

＆＃13;

<img id="glavnaSlika" src="//lorempixel.com/500/500/cats/1">
<div id="sveSlike" onclick="promjeniSliku(event)">
  <img src="//lorempixel.com/100/100/cats/1" alt="" />
  <img src="//lorempixel.com/100/100/cats/2" alt="" />
  <img src="//lorempixel.com/100/100/cats/3" alt="" />
  <img src="//lorempixel.com/100/100/cats/4" alt="" />
  <img src="//lorempixel.com/100/100/cats/5" alt="" />
  <img src="//lorempixel.com/100/100/cats/6" alt="" />
  <img src="//lorempixel.com/100/100/cats/7" alt="" />
  <img src="//lorempixel.com/100/100/cats/8" alt="" />
  <img src="//lorempixel.com/100/100/cats/9" alt="" />
  <img src="//lorempixel.com/100/100/cats/10" alt="" />
  <img src="//lorempixel.com/100/100/cats/11" alt="" />
  <img src="//lorempixel.com/100/100/cats/12" alt="" />

</div>

＆＃13;

Onclick功能在图库中没有任何作用

2 个答案: