Stoppcode wird ausgeführt, wenn der Benutzer div aufhebt

Question

Ich versuche die Ausführung der setInterval-Funktion zu stoppen, wenn der Benutzer das ausgewählte div aufhebt, aber ich kann es nicht zum Laufen bringen. Irgendwelche Ideen?

Ich habe das klare Intervall versucht und das funktioniert nicht. Ich habe auch versucht, den cvalue von dieses zu verwenden, aber es aktualisiert nicht innerhalb des Codes.

$(document).on("click",".profTemp", function() 
       { 
        var pollUser; 
        if(!$(this).hasClass('selected')) 
        { 
        var selectedUser; 
        var previous = null; 
        var current = null; 
        var assigned = false; 

        selectedUser = $(this).children('span').text(); 
        selectedUser = selectedUser.trim(); 



        //selectedUser = $(this).children('span').text(); 
        console.log(selectedUser); 
        $(this).toggleClass('selected'); 

        //selectedUser = selectedUser.trim(); 

        pollUser = setInterval(function() 
        { 

         console.log(selectedUser); 
         $.ajax({ 
         url: '/getJSON', 
         dataType: 'json', 
         success: function(response) { 
          console.log(response + "84897348"); 
          obj = JSON.parse(response); 
          console.log(selectedUser + "inside success"); 

          var changeTo; 
          var deviceID; 

          console.log(current + "current"); 
          for(var i = 0; i < obj.clients.length; i++) 
          { 
           if((selectedUser == obj.clients[i].userName) && (assigned == false)) 
           { 
           console.log(selectedUser + " inside if"); 
           current = JSON.stringify(obj.clients[i]); 
           changeTo = obj.clients[i].uri; 
           device = obj.clients[i].deviceID 
           assigned = true; 
           } 
          } 
          assigned = false; 

          console.log(current + " current"); 
          console.log(previous + "previous"); 

          if(previous !== current) 
          {   

           console.log("ARE WE INSIDE HERE"); 

           $.ajax({ 
           url: 'https://api.spotify.com/v1/me/player/play', 
           contentType: 'application/json', 
           type: 'PUT', 
           dataType: 'json', 
           headers: { 
            'Authorization': 'Bearer ' + access_token 
           }, 
           data: JSON.stringify({"uris":[changeTo], "device_id":device, "offset": { "uri":changeTo} }), 
           success: function(response) { 
            console.log(response); 
           } 
           }); 
          } 
          } 
         }); 
         previous = current; 
         console.log(selectedUser); 
        }, 2000); 
        } 

        else if($(this).hasClass('selected')) 
        { 
        $(this).toggleClass('selected'); 
        console.log("not selected"); 
        clearInterval(pollUser); 
        }  

       }); 

`

Answer 1

var pollUser ist, wo Sie erwarten, dass die ID des setInterval korrekt sein? Weil später in der Funktion, tun Sie pollUser = setInterval(function().... Siehe docs auf setInterval.

Das funktioniert nicht, weil auf jeden click von .profTemp, ein neuen pollUser Variable schaffen durch var pollUser an der Spitze Ihrer Funktion zu tun.

Wenn Sie möchten, dass die ID Ihres setInterval tatsächlich gespeichert wird, sollten Sie sie in einer Variablen außerhalb des Bereichs der Click-Handler-Funktion speichern, damit sie beibehalten wird.

Some more resources on function scope

und auf "var"

Answer 2

Put var pollUser; vor onclick Funktion.