Meine Galerie Tasten in js wird nicht funktionieren

Question

Ich mache eine Galerie, um dies in meiner eigenen Seite zu verwenden, habe ich Controller divs richtig platziert, habe ich ein Skript gemacht, aber es wird nicht funktionieren. Das ist es:

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

Ich meine letzten zwei Funktionen, ich onclick Event angeschlossen, aber es gibt NaN in der Konsole zurück. Dies ist HTML-Code:

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

Ich denke, es ist ein Fehler mit der ID zweimal durch die zweite Funktion zu senden, aber ich weiß nicht, wie es zu beheben, bitte helfen Sie mir

Answer 1

:) Ich glaube, Sie sind illegal Transformieren Sie id Variable ....

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

... das ist, warum Sie NAN kehren in die Konsole

try ..

var id = identity += 1; 

Answer 2

Basierend auf Kommentaren klingt es wie die identity Variable in den onclick Ereignissen ist nicht das, was Sie erwarten. Werfen Sie einen Blick darauf, wie diese Variable gesetzt wird:

var identity = id; 

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

Sie Wert auf diese Variable gesetzt, aber in der onclick Funktion deklarieren Sie eine neue lokale Variable genannt identity, die nichts zu tun hat mit dem, den du außerhalb dieser Funktion einstellst. Was auch immer der Browser als erster (wenn überhaupt) Parameter zu diesem Ereignis sendet, wird nicht Ihre identity Variable sein und wird wahrscheinlich überhaupt nicht numerisch sein.

Sie brauchen nicht den Funktionsparameter, es ist nur vollständig entfernen:

var identity = id; 

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