Forum PHP.pl

Potrzebuję zmienić id lub klasę dla jednego obiektu.

[HTML] pobierz, plaintext 
<a href='#' class='zgas'><img src='img/lightoff.png' alt='Zgaś/Zaświeć światło'></a>
[HTML] pobierz, plaintext 

Chodzi o .zgas aby zmienił się na .zaswieć i potem na odwrót, po kliknięciu w .zaswiec żeby zmienił się na .zgas

Na razie mam taki kod:

[JAVASCRIPT] pobierz, plaintext 
	$(".zgas").click(function(){$("#expose").expose({api: true}).load(); $(".zgas img").attr("src","img/lighton.png"); $(".zgas").addClass("zaswiec");});
	$(".zaswiec").click(function(){$("#expose").expose({api: true}).close(); $(".zaswiec img").attr("src","img/lightoff.png");});
[JAVASCRIPT] pobierz, plaintext 

Tutaj dodatkowo zmiana obrazka i expose (obie działają tylko na włączeniu). Pomóżcie.

[JAVASCRIPT] pobierz, plaintext 
$('.zgas').click(function () { $('#expose').expose({api: true}).load(); $(this).find('img').attr('src', 'img/lighton.png').end().removeClass('zgas').addClass('zaswiec'); });
[JAVASCRIPT] pobierz, plaintext 

W takich sytuacjach brakuje w jQuery funkcjonalności zamiany jednej klasy na inną jednym poleceniem, co na szczęście można sobie łatwo dodać:

[JAVASCRIPT] pobierz, plaintext 
jQuery.fn.replaceClass = function(c1, c2)
{
	return $(this).each(function () { return $(this).hasClass(c1) ? $(this).removeClass(c1).addClass(c2) : $(this); });
};
[JAVASCRIPT] pobierz, plaintext 

Wówczas zamiast (...).removeClass('zgas').addClass('zaswiec'); wystarczyłoby zapisać (...).replaceClass('zgas', 'zaswiec');.

Ten post edytował mls 16.02.2010, 21:57:49

Ok dwa sposoby prawie działają Zrobiłem to tak, że najpierw remove a potem add ale niestety coś się chrzni i zamiast robić klasę "zaswiec" wpisuje " zaswiec" ze spacją na początku, chociaż w kodzie jej nie ma. Co to moze byc?

[JAVASCRIPT] pobierz, plaintext 
$(".zgas").click(function(){$("#expose").expose({api: true}).load(); $(".zgas img").attr("src","img/lighton.png"); $(this).removeClass("zgas").addClass("zaswiec");});
[JAVASCRIPT] pobierz, plaintext 

Poczytałem na stronce jQuery i ktoś dał pomysł żeby zrobić to za pomocą:

[JAVASCRIPT] pobierz, plaintext 
$(this).attr("class","zaswiec")
[JAVASCRIPT] pobierz, plaintext 

I zamienia bezproblemowo z tym, że potem nie działa na tym funkacja kliknięcia na tą dodaną klasę (zaswiec):

[JAVASCRIPT] pobierz, plaintext 
$(".zaswiec").click(function(){$("#expose").expose({api: true}).close(); $(".zaswiec img").attr("src","img/lightoff.png");});
[JAVASCRIPT] pobierz, plaintext 

:/

Jeśli zmieniasz czemuś klasę to musisz ponownie podpiąć event .click() na tą klasę, którą dodajesz.

Ponownie czyli jak? Bo jest na poniżej dopisany event po kliknięciu na to.

Po pobieżnej analizie problemu sugeruje zmienić na i podobnie dla .zgas .

Ten post edytował lord_t 19.02.2010, 21:25:16

Live załatwiło sprawę wielkie dzięki.