Question

我正在一个画廊在我自己的页面中使用它，我已经正确地放置了控制器div，我已经制作了一个脚本但是它不会工作。那就是它：

function changePhoto(id) {

         var y = document.getElementById("baza_big_photo_img");
         var x = document.getElementById("br_hidden");
            y.style.border = "2px solid grey";
            x.style.display = "block";

         var z = "./zdjecia/" + id + ".jpg";
         y.src = z;

         var ui = document.getElementById("overlay");
         ui.style.display = "block";


         var next = document.getElementById("next");
         var prev = document.getElementById("prev");
         var identity = id;

            next.onclick = function(identity) {
                var id = identity/1 + 1;
                var z = "./zdjecia/" + id + ".jpg";
                y.src = z;
            }
            prev.onclick = function(identity) {
                var id = identity;
                if(id == 1) {
                    var z = "./zdjecia/" + id + ".jpg";
                } else {
                    id = id/1 + 1;
                    var z = "./zdjecia/" + id + ".jpg";
                }
                y.src = z;
            }
     }

我的意思是最后两个函数，我附加了onclick事件，但它在控制台中返回NaN。这是HTML代码：

<div id="overlay">
    <div id="prev"><--</div>
    <div id="next">--></div>
    <img src="" id="baza_big_photo_img">
</div>

    <div class="br4 hidden" id="br_hidden"></div>

    <div class="baza_zdjecia" onclick="changePhoto(1);"><img src="./zdjecia/1.jpg" class="fitimg"></div>
    <div class="baza_zdjecia" onclick="changePhoto(2);"><img src="./zdjecia/2.jpg" class="fitimg"></div>
    <div class="baza_zdjecia" onclick="changePhoto(3);"><img src="./zdjecia/3.jpg" class="fitimg"></div>
    <div class="baza_zdjecia" onclick="changePhoto(4);"><img src="./zdjecia/4.jpg" class="fitimg"></div>
    <div class="baza_zdjecia" onclick="changePhoto(5);"><img src="./zdjecia/5.jpg" class="fitimg"></div>
    <div class="baza_zdjecia" onclick="changePhoto(6);"><img src="./zdjecia/6.jpg" class="fitimg"></div>
    <div class="baza_zdjecia" onclick="changePhoto(7);"><img src="./zdjecia/7.jpg" class="fitimg"></div>
    <div class="baza_zdjecia" onclick="changePhoto(8);"><img src="./zdjecia/8.jpg" class="fitimg"></div>

我认为在第二个功能中发送ID两次有一个错误，但我不知道如何解决它，请帮助我：）

Answer 1

基于评论，听起来identity事件中的onclick变量并不是您所期望的。看一下如何设置变量：

var identity = id;

next.onclick = function(identity) {
    var id = identity/1 + 1;
    var z = "./zdjecia/" + id + ".jpg";
    y.src = z;
}

您执行为该变量设置一个值，但在onclick函数中，您声明了一个名为identity的 new 局部变量，该变量具有与你在该功能之外设置的那个无关。无论浏览器发送什么作为该事件的第一个（如果有）参数都不是您的identity变量，并且可能根本不是数字。

您不需要函数参数，只需将其完全删除：

var identity = id;

next.onclick = function() {
    var id = identity/1 + 1;
    var z = "./zdjecia/" + id + ".jpg";
    y.src = z;
}

Answer 2

我相信你是非法改变你的id变量......

pattern="[0-9]*"

...这就是你在控制台中返回NAN的原因

尝试..

next.onclick = function(identity) {
  var id = identity/1 + 1;
  var z = "./zdjecia/" + id + ".jpg";
  y.src = z;
}

js中的我的画廊按钮不起作用

2 个答案: