Jestem stosunkowo nowy w JavaScript i chociaż wiem, co powoduje błąd, nie jestem pewien, jak to zreferować, aby to działało.

for ( ... ) {
    var variableQueryValue = i

    addLink.bind('click', function() {
        $.ajax({
            type: 'POST',
            url: '/example',
            data: 'queryvalue=' + variableQueryValue,
            success: function(data) {
                console.log('Got into success method!');
            }
        });
    });
}

Zasadniczo jesteśmy wiązaniem zdarzenia kliknięcia na pewnym elemencie, którego atrybut danych zależy od niektórych zmiennejVerii, która zmienia każdą iterację. Ze względu na zamknięcie obsługi funkcji wiązania, na żądaniu Ajax będzie wiązać przewóz zdarzenia, który wykorzystuje taką samą wartość zmiennej w każdej iteracji.

Jak mogę zrefleksorować to takie, że zaktualizowana zmiennaValue jest brana pod uwagę?

Dzięki za pomoc!

2
PolandSpring 3 październik 2011, 23:07

5 odpowiedzi

Najlepsza odpowiedź
function create_handler( j ) {
    return function( e ) {
        $.ajax({
            type: 'POST',
            url: '/example',
            data: 'queryvalue=' + j,
            success: function(data) {
                console.log('Got into success method!');
            }
        });
    };
}

for ( ... ) {
    addLink.bind('click', create_handler( i ) );
}

Wywołaj funkcję, która tworzy obsługę, przekazywanie {x0}} do tej funkcji. Następnie zapoznaj się z tym funkcją RETURN , który ma być przypisany do .bind('click',....

Dzieje się tak dlatego, że przywołujesz funkcję, tworzysz nowe środowisko zmienne. Więc kiedy zdobędziesz wartość i do funkcji i utwórz obsługę w tej samej funkcji, obsługuje teraz odwołanie do wartości, która została przekazana w tym konkretnym środowisku zmiennym.

Handler zachowuje oryginalne zmienne środowisko, w którym został utworzony (mimo że wracasz Handler) , więc zawsze będzie odwoływać się do właściwego wartości i.


Istnieją inne rozwiązania problemu zachowującego trwałą wartość używaną w przewodzie, ale rozwiązuje ten konkretny problem zamknięcia. W zależności od rzeczywistej sytuacji, może to nie być, co chcesz zrobić.

4
user113716 3 październik 2011, 19:17

Zasadniczo nie ma powodu, aby wiązać się z każdym linkiem indywidualnie. Wybierz grupę i wiążą do grupy do grupy.

Dodaj dowolną wartość, musisz addLink poprzez połączenie z {x1}} w pętli. Następnie pobieraj wartość w programie Click Event Deskment.

1
BNL 3 październik 2011, 19:12

Musisz zamknąć zmienną o wartości, jeśli i podczas każdej iteracji pętli do pętli.

for ( ... ) {
    (function(variableQueryValue){
      addLink.bind('click', function() {
          $.ajax({
              type: 'POST',
              url: '/example',
              data: 'queryvalue=' + variableQueryValue,
              success: function(data) {
                  console.log('Got into success method!');
              }
          });
      });
    })(i);
}
1
Wizard of Ogz 3 październik 2011, 19:54

Czy możesz użyć .live () w tym celu?

API mówi:

Opis: Dołącz obsługę do zdarzenia dla wszystkich elementów, które pasują do bieżącego selektora, teraz iw przyszłości.

Myślę, że zaspokoiłby fakt, że twój selektor nie istnieje w momencie dodawania wydarzenia ... czy źle zinterpretowany?

0
dougajmcdonald 3 październik 2011, 19:12

Możesz owinąć każde wywołanie zwrotne, aby utworzyć zamknięcie:

addLink.bind((function(variableQueryValue) {
    return function() {

        // variableQueryValue can be used here
        $.ajax...
    };
}(variableQueryValue)));

W ten sposób natychmiast uruchomisz wywołanie zwrotne, które zwraca nową funkcję, którą ma zmienną lokalną zapisaną, więc nie można go zmienić z zewnątrz.

0
David Hellsing 3 październik 2011, 19:12