Kann keine Schleife JQuery .hover()

Question

JQuery .hover() -Methode wird Problem auftreten, wenn Sie eine Schleife darauf ausführen möchten. Sagen wir, ich Code haben als

folgen

<div class="screen screen_1"></div> 
<div class="screen screen_2"></div> 
<div class="screen screen_3"></div> 

for(j=0; j<$('.screen').length+1; j++){ 
    $('.screen_'+ j +'').hover(
     function mousein(){ 
     //do something when mouse enters 

     }, function mouseout(){ 
     //do something else when mouse leaves 
     } 
); 
} 

jetzt jhint sagt mir nicht eine Funktion in einer Schleife zu tun, so habe ich die folgenden, aber es immer noch nicht mag es.

var mousein = function(){ 
    //do something when mouse enters 
}; 

var mouseout = function(){ 
    //do something else when mouse leaves 
}; 

for(j=0; j<$('.screen').length+1; j++){ 
    $('.screen_'+ j +'').hover(
    mousein, mouseout; 
); 
} 

Vielen Dank im Voraus

Answer 1

keine Notwendigkeit für die Schleife ...

$('.screen').hover(
    function(){ 
     //do something when mouse enters 
     // $(this) gets you the element being affected. 
     }, function(){ 
     //do something else when mouse leaves 
     } 
); 

Answer 2

die ; innen Funktionsargumente entfernen

$('.screen_'+ j +'').hover(mousein, mouseout/*;*/); 
              //^^ not valid 

Answer 3

Beseitigt die Notwendigkeit für externe Funktionen ..

$('.screen').mouseenter(function() { 
    //do something when mouse enters 
}).mouseleave(function() { 
    //do something else when mouse leaves 
}); 

Answer 4

Um einen Handler zuzuordnen, ist es nicht notwendig, ihn zu durchlaufen. verwenden Sie einfach:

$(".screen").on("mouseenter mouseleave",function(event){ 
    switch(event.type){ 
     case "mouseenter": 
      // code for mouse in 
      break; 
     case "mouseleave": 
      // code for mouse out 
      break; 
} 

Verwenden Sie $ (this), um das Element zu verwenden, das das Ereignis ausgelöst hat. Wenn zum Beispiel .screen_1 das Ereignis ausgelöst hat $ (this) entspricht im Wesentlichen der Verwendung von $ (". screen_1")

Answer 5

Das Problem mit Ihrer Schleife ist, dass Sie im Wesentlichen versuchen, für die ersten n Rahmen zu loopen. Wenn Sie möchten, dass etwas beim Überfahren von etwas in der Schleife wiederholt wird, muss sich die Schleife innerhalb der Funktion befinden, nicht innerhalb der Schleife. So sollte Ihr Code ein bisschen mehr wie folgt aussehen:

$('.screen_'+ j +'').hover(
    function mousein(){ 
    //do loop 

    }, function mouseout(){ 
    //do loop 
    } 
);