4

Construí um plugin usando jQuery.fn.algumaCoisa = function(options, callback){};, mas quando chamo várias vezes no mesmo elemento, fica multiplicando o comportamento em vez de sobrepor. Tem alguma maneira de sempre que chamar essa função ele resetar o efeito sobre o elemento?

Ao chamar no mesmo elemento ele deveria resetar o comportamento, mas os botões internos estão tendo efeito multiplicado, resumindo, não estão perdendo os efeitos atribuídos anteriormente.

$('div').algumaCoisa(); // usario clica em um botão e chama
$('div').algumaCoisa(); // usario clica em um botão e chama
$('div').algumaCoisa(); // usario clica em um botão e chama
2
  • é um tanto complicado responder esta pergunta, sem saber o que tem nessa função alguma coisa, pois pensando um um função que manipule o dom do elemento, com o "reset" saberia o que foi alterado? seria necessário criar uma variável com se fosse um log das alteracções. Commented 1/09/2015 às 1:14
  • 1
    Orion poderia dar mais detalhes? Pois o .fn. tem a funcao apenas de percorrer os elementos selecionados com uma funcao customizada, o problema parece ser no seu function, entretanto voce pode talvez usar um atributo nos elementos pra detectar se eles foram ja setados. Vou tentar formular uma resposta.
    – Syzoth
    Commented 1/09/2015 às 2:07

3 Respostas 3

2

Seu problema ocorre pois os eventos são setados de forma acumulativa, para resolvermos isso vamos depender um pouco da forma que você implementou. Irei mostrar dois exemplos o com evento de .click() e com .on() que são dois manipuladores de eventos do jQuery disponíveis nas versões 1.7 + .

Com uso do .click():

jQuery.fn.algumaCoisa = function(){ 

    //ele remove todos os eventos de click antes de setar
    $(this).unbind('click');

    //seta seu evento
    $(this).click(function() {
        alert("teste1");
    });    
}

Com uso do .on():

jQuery.fn.algumaCoisa = function(){ 

    //ele remove todos os eventos de click antes de setar
    $(this).unbind('click');

    //seta seu evento
    $(this).on('click', function() {
        alert("teste1");
    });    
}

Segue jsfiddle, se estiver usando alguma forma diferente de setar o evento é só falar nos comentários!

1
  • 1
    O problema é que eu achava que ao remover a função do elemento destruiria todas efeitos internos setados por essa função, resolvi chamando unbind() nos elementos internos antes de setar novamente.
    – Paulo
    Commented 1/09/2015 às 17:54
1

A funcao do jQuery.fn não e atribuir nada, ele apenas passar os nodes selecionados para o seu metodo customizado. Quem define se vai adicionar repetidas vezes e voce.

No caso voce pode usar o attr() pra detectar se o node ja recebeu o atributo (se voce for usar apenas pra nodes), recomendo que tambem verifique se o item selecionado realmente e um node, pois o $(...) pode receber window e document tambem.

function isDOM(el) {
   return el && el instanceof HTMLElement;
}

jQuery.fn.foo = function() {
    this.each(function() {
       if (isDOM(this) && $(this).attr("data-foo") !== "true") {
           $(this).attr("data-foo", "true");

           //Algo aqui
       }
    });
};

Desta maneira voce pode fazer varios seletores diferentes e ele vai detectar se o elemento html ja recebeu o efeito esperado.

Se o que voce quer e remover o efeito em elementos que ja o tenham, voce pode fazer assim:

function aplicaEfeito(el) {
    //Aqui aplica o efeito
}

function removeEfeito(el) {
    //Aqui remove o efeito
}

function isDOM(el) {
   return el && el instanceof HTMLElement;
}

jQuery.fn.foo = function() {
    this.each(function() {
       if (isDOM(this)) {
           if ($(this).attr("data-foo") !== "true") {
               $(this).attr("data-foo", "true");
                aplicaEfeito($(this));//Aplica o efeito
           } else {
                removeEfeito($(this));//Primeiro remove o efeito
                aplicaEfeito($(this));//Aplica o efeito novamente
           }
       }
    });
};
0

Faça isso:

delete $.fn.nomedoplugin;

Isso não afeta as instâncias do plugin já inicializadas.

1
  • O que eu quero na realidade é zerar os efeitos sobre o elemento quando chamar a função novamente.
    – Paulo
    Commented 31/08/2015 às 22:29

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .