Użycie jQuery .attr lub .prop do ustawienia wartości atrybutu nie działa

Utworzono przycisk z atrybutem o nazwie "załadowany" i wartością początkową "nie". Po kliknięciu przycisku używam jakiegoś ajaxa i na samym jego końcu próbuję ustawić "ładowany" atrybut na "tak", aby ajax nie był uruchamiany ponownie, jeśli użytkownik kliknie przycisk więcej niż jeden raz .Użycie jQuery .attr lub .prop do ustawienia wartości atrybutu nie działa

mam coś takiego: http://jsfiddle.net/PDW35/2/

Kliknięcie przycisku nie powoduje zmiany załadowany na „tak”. Jeśli jednak zrobić powiadomienie prawo po wywołaniu .attr tak:

alert($(this).attr('loaded'));

alert box nie zawiera „tak”, która nie pomaga, ponieważ po użytkownik kliknie ten sam kod wyżej stawia się "Nie" pole ostrzeżenia na ekranie.

Wszystko zachowuje się tak samo, jeśli używam .prop zamiast .attr. Czy brakuje mi tutaj punktu, czy też .prop i .attr po prostu nie działają z atrybutami niestandardowymi?

EDIT: Updated jsfiddle użyciu ajax na podstawie poniższych uwag: http://jsfiddle.net/PDW35/5/

Źródło

2013-08-01 mmvsbg

Czy oglądasz oryginalny kod źródłowy przez przypadek podczas sprawdzania atrybutu 'loaded'? Ponieważ działa w tym skrzypku dla mnie w Chrome – CodingIntrigue

Za każdym razem klikam przycisk po raz drugi i tak dalej - to ostrzeże "tak". Atrybut jest ustawiony prawidłowo. Ale spróbuj użyć dozwolonych atrybutów zaczynających się od 'data-' i użyj funkcji jQuery 'data()' do pracy z nimi. –

Jeśli tworzysz własny atrybut, dodaj go przedrostkiem 'data-'. Ponadto nazwy atrybutów nie mogą zawierać podkreślników. – Blender

Nie jestem dokładnie pewien powód oryginalny kod nie działa, ale $this wydaje się być przyczyną jakiegoś powodu. Spróbuj poniżej i wydaje się, że działa. Fiddle jest tutaj.

Postaram się zaktualizować odpowiedź z uzasadnieniem, gdy tylko ją znajdę.

var loaded = $(".preview-button").attr('data-loaded'); 
if (loaded === "no") { 
    $.ajax({ 
     success: function (result) { 
      $(".preview-button").attr('data-loaded', 'yes'); 
      alert($(".preview-button").attr('data-loaded')); 
     } 
    }); 
} else { 
    alert("data loaded"); 
}

Patrz ten thread i to wydaje się być powodem, dla którego $this robi wydaje się działać od wewnątrz wywołania AJAX.

Źródło

2013-08-01 07:55:53 Harry

To interesujące, masz rację !!! Działa teraz, jeśli znajdę powód, dla którego $ to się nie powiedzie, opowiem tutaj również! – mmvsbg

Myślę, że $ (this) nie jest po prostu zdefiniowana (lub, co bardziej prawdopodobne, predefiniowane) w funkcji sukcesu .ajax. Spójrz na następujące JSfiddle: http://jsfiddle.net/PDW35/8/ Pierwsze pole alertu wyświetla klasę przycisku, drugie po prostu mówi "niezdefiniowane". – mmvsbg

@ mmvsbg no mate, sprawdź aktualizację, którą wprowadziłem do odpowiedzi. w ramach połączenia Ajax $ odnosi się do połączenia, a nie do przycisku, który wystrzelił zdarzenie. to jest powód, dla którego pierwszy alert (poza ajax) działa, a drugi (wewnątrz) nie robi. – Harry

przeczytaniu pytanie ..

tak że ajax nie prowadził jeszcze raz, jeśli użytkownik kliknie na przycisk ponad pewnego razu.

myślę, że trzeba one(), pozwala to zdarzenie, aby uruchomić tylko raz .. nie ma potrzeby zmieniania atrybutów i właściwości

przykładowe

$(".preview-button").one('click',function(){ 
//your ajax stuff 
    alert('clicked!!!!'); 
});

Źródło

2013-08-01 07:28:28 bipen

To dobra wskazówka, jednak jedną z innych rzeczy, które robię po kliknięciu przycisku, jest .slideToggle div, który musi się zdarzyć więcej niż raz. Chcę tylko załadować ajax raz (który przechodzi do elementu div, który przesuwa się w górę iw dół). – mmvsbg

Można ustawić właściwość dla click (lub submit) funkcja:

$(".preview-button").click(function() { 
    this.ajaxCompleted = this.ajaxCompleted || false; 

    if (!this.ajaxCompleted) { 
     // run your request and set this.ajaxCompleted to true in a callback; 
    } 

    // do other stuff 
});

Źródło

2013-08-01 07:37:06

możesz spróbować foll odpowiedni kod: po kliknięciu danych zostanie wczytane, drugie kliknięcie wyświetli komunikat, że dane są już załadowane.

$(".preview-button").click(function(){ 

var id = $(this).attr('button_id'); 
var loaded = $(this).attr('loaded'); 
    if(loaded == "no"){   
     $(this).attr('loaded', 'yes'); 
    }else{ 
     alert("Data is loaded");  
    } 
});

przykład pracuje tutaj: http://jsfiddle.net/PDW35/4/

Źródło

2013-08-01 07:41:14 maverickosama92

Użycie jQuery .attr lub .prop do ustawienia wartości atrybutu nie działa

Odpowiedz

Powiązane problemy