[JS] Kolejkowanie lub opóźnianie funkcji

Odpowiedz Nowy wątek
2011-10-18 22:37
0

Witam
Zrobiłem galerią w JS i wywołuję ją na stronie funkcją "galery(...)". W definicji tejże funkcji korzystam z AJAX -> PHP wiec jej wykonanie trwa jakiś czas.

Problem tkwi w tym że gdy chcę wywołać funkcję "galery(..)" kilka razy z przyczyn oczywistych każde kolejne wywołanie nie czeka na wykonanie się poprzedzającej funkcji. Najłatwiejszym rozwiązanie byłoby pewnie wywołanie jej w "setTimeout" z pewnym zapasem lecz gdy odpowiedź serwera będzie dłuższa od zakładanej wszystko się posypie a tego bym nie chciał.
Jaki byłby najrozsądniejszy sposób kolejkowania lub opóźniania tych funkcji.
Pozdrawiam.


"Wiadomo, że taki a taki pomysł jest nie do zrealizowania. Ale żyje sobie jakiś nieuk, który o tym nie wie. I on właśnie dokonuje tego wynalazku." - (Albert Einstein)

Pozostało 580 znaków

2011-10-18 22:49
nnn
0

Może byś tak podał kod* co? Skąd by mamy wiedzieć gdzie masz błąd?

* który się sypie, żeby nie było, że Ci chcemy ukraść.

Pozostało 580 znaków

2011-10-18 23:06
0

Funkcja "galery(...)" jest funkcją wykonawczą wielu innych funkcji, między innymi funkcji $.AJAX. Ta z kolei odwołuje się do skryptu PHP który musi poczekać na odpowiedź serwera. Gdy już ją otrzyma zwraca do JS wartości pewnych zmiennych. Sama funkcja "galery(...)" jak i inne funkcje które wykonuje nie zawierają błędów. Gdy wywołuję ją na stronie tylko raz wszystko smiga. Problem w tym że gdy wykonuje ją kilka razy z rzędu nadpisuje wartości pewnych zmiennych galerii (a AJAX -> PHP jest jeszcze w toku) nadanych przez poprzedzające wywołania. Co za tym idzie pewne zmienne (z AJAX) mają wartości z pierwszego wywołania a inne (bez AJAX) z drugiego wywołania. W samych kodzie funkcji nie ma błędów. Liczę na podpowiedz dotyczącą sposobu rozwiązania tej sytuacji. Z kodem sobie poradzę.


"Wiadomo, że taki a taki pomysł jest nie do zrealizowania. Ale żyje sobie jakiś nieuk, który o tym nie wie. I on właśnie dokonuje tego wynalazku." - (Albert Einstein)

Pozostało 580 znaków

2011-10-19 14:01
pan kuba
0

Poniżej moja ogólna koncepcja rozwiązania problemu. Pokomentowałem tu i ówdzie, także chyba da radę zrozumieć co się dzieje. Enjoy ;)

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <script src="jquery.js"></script>
  <script>

    var Kolejka = function(opcje) {

      // ustawienie opcji
      opcje = opcje || {};
      opcje.url = opcje.url || "";
      opcje.odpowiedz = opcje.odpowiedz || function() { };

      // lista zakolejkowanych elementów
      var lista = [];

      var aktywny = false;

      function dodaj(co) {
        lista.push(co);
        // odpal wysyłanie zapytań do serwera tylko jeden raz, w momencie dodania pierwszego elementu do listy
        if (lista.length == 1 && !aktywny) {
          aktywny = true;
          dzialaj(0);
        }
      };

      function dzialaj(numer) {
        // nie ma nic w kolejce, przerwij i resetuj
        if (numer >= lista.length) {        
          aktywny = false;
          lista = []; 
          return;
        }

        // pobierz ostatni dodany element
        // zostanie on przekazany do serwera
        var dana = lista[numer];

        // AJAX MAGIC!
        // przetwarzaj.php robi coś z przekazanym elementem i zwraca odpowiedź)
        $.get(opcje.url + dana, function(odpowiedz) {
          // odpowiedź z serwera umieść w polu tekstowym
          opcje.odpowiedz(odpowiedz);

          // i jeszcze raz to samo, w koło macieju
          dzialaj(numer + 1);
        });

      };

      this.dodaj = dodaj;
    };

    $(window).ready(function() {

      var kulejka = new Kolejka({
        url: "przetwarzaj.php?dana=",
        odpowiedz: function(odpowiedz) {
          $("#tbOdpowiedzi").val( $("#tbOdpowiedzi").val() + "\r\n" + odpowiedz );
        }
      });

      $("article a.eg").click(function(evt) {

        // dodaj do kolejki zawartość html klikniętego linka
        kulejka.dodaj($(this).html());

        evt.preventDefault();
      });
    });

  </script>
  <style>
    body { width: 600px; margin: 0 auto; font-family: Arial sans-serif; }
    ul { list-style-type: none; }
    ul li { display: inline; }
    #tbOdpowiedzi { width: 400px; height: 220px; }
  </style>
</head>
<body>
  <article>
    <ul>
      <li><a href="#" class="eg">abra</a></li>
      <li><a href="#" class="eg">kadabra</a></li>
      <li><a href="#" class="eg">hokus</a></li>
      <li><a href="#" class="eg">pokus</a></li>
      <li><a href="#" class="eg">czary</a></li>
      <li><a href="#" class="eg">mary</a></li>
    </li>
    <textarea id="tbOdpowiedzi"></textarea>
  </article>
</body>
</html>

Pozostało 580 znaków

2011-10-19 14:59
0

thnx. Pokombinuję... :)


"Wiadomo, że taki a taki pomysł jest nie do zrealizowania. Ale żyje sobie jakiś nieuk, który o tym nie wie. I on właśnie dokonuje tego wynalazku." - (Albert Einstein)

Pozostało 580 znaków

Odpowiedz
Liczba odpowiedzi na stronę

1 użytkowników online, w tym zalogowanych: 0, gości: 1, botów: 0