2017-12-20 1 views
1

Ich habe folgenden JQuery Code, der eine Funktion ausgeführt wird, wenn die Seite, in der Nähe der unterenJQuery Fenster scroll

var start = 2; 
var limit = 2; 
$(window).scroll(function() { 
    if($(window).scrollTop() + $(window).height() > $(document).height() - 100) { 
    console.log(start); 
    //f($(window).scrollTop() == $(document).height() - $(window).height()) { 
     get_ticket_updates(start, limit); 

     start = (start + 2); 
    } 
}); 

i für die start Variable in dem Konsolenprotokoll hinzugefügt gescrollt wird, die 2 jedes Mal hinzuzufügen, ist jedoch, wenn scrollte zum unteren Rand der Seite, die ständig 2 hinzufügt und die Funktion ausführt und nicht aufhört.

Wie kann es gestoppt werden, wenn es bereits ausgeführt wurde, bis die Seite erneut gescrollt wird?

UPDATE - Zusatzfunktion:

function get_ticket_updates(start, limit) { 
    $("#ticket_updates_loading").show(); 

    var seq = '<?php echo $_GET["seq"]; ?>'; 
    $.ajax({ 
     type: "GET", 
     url: "/section/tickets/view-ticket?action=get_updates&seq=" + seq + "&start=" + start + "&limit=" + limit, 
     cache: false, 
     success: function(data) { 
      $("#ticket_updates_loading").hide(); 
      $("#ticket_updates_area").append(data); 
     } 
    }); 
} 
+0

Was macht get_ticket_updates? Ist es eine asynchrone Methode, um mehr Ergebnisse für das unendliche Scrollen zu laden? – Taplar

+0

Wahrscheinlich müssen Sie sich eine [debounce-Funktion] (https://davidwalsh.name/javascript-debounce-function) ansehen - sonst läuft das viel zu oft, wenn Sie eigentlich nur einmal pro Rolle laufen wollen ". –

+0

Bitte beachten Sie mein Update mit der Funktion – charlie

Antwort

0

Versuchen Sie, ein Flag, das zurückgesetzt wird, wenn außerhalb der spezifischen Scroll-Höhe erhält, so dass Sie wissen, ob Sie die Funktion oder nicht

var start = 2; 
 
var limit = 2; 
 
var hasRan = false; 
 
$(window).scroll(function() { 
 
    console.log(hasRan +" : "+ start); 
 

 
    if($(window).scrollTop() + $(window).height() < $(document).height() - 100) { 
 
    // reset flag when no longer at bottom of page 
 
    hasRan = false; 
 
    } else { 
 
    if (hasRan == false) { 
 
     get_ticket_updates(start, limit); 
 
     start = (start + 2); 
 
     // function has ran, trigger flag 
 
     hasRan = true; 
 
    } 
 
    } 
 
});
.box { 
 
    height: 400vh; 
 
}
<div class='box'></div>
laufen soll

+0

gerade versucht, aber es scheint nicht zu funktionieren die Funktion jetzt – charlie

+0

Haben Sie es auskommentieren? –