2010-11-02 14 views
5

In parole semplici: la linea currentItem.toggleClass('open'); non sembra funzionare.jQuery toggleClass non funziona?

Più precisamente, durante l'ispezione dei risultati con firebug, posso vedere la classe "open" lampeggiante (che appare e scompare immediatamente) sull'elemento pertinente. Quindi è come se la funzione fosse effettivamente attivata due volte (ovviamente clicco una sola volta).

Qualcuno può spiegarmi perché questo è e come prevenirlo?

Ecco il mio codice jQuery:

$('div.collapse ul.radio_list li input[type=radio]').click(function (event) { 

    var currentTree = $(this).parent().parent().parent(); 
    var currentItem = $(this).parent().parent(); 
    var currentGroup = currentItem.attr('rel'); 

    $(this).parents('ul').children('li').removeClass('select'); 
    if ($(this).is(':checked')) { 
     currentItem.addClass('select'); 
    } 

    currentItem.toggleClass('open'); 

    var currentLevel = 0; 
    if (currentItem.is('.level1')) {currentLevel = 1;} 
    if (currentItem.is('.level2')) {currentLevel = 2;} 
    if (currentItem.is('.level3')) {currentLevel = 3;} 
    var nextLevel = currentLevel + 1; 

    currentTree.children('li').filter('li[rel ^=' + currentGroup + '].level' + nextLevel).animate({'height': 'show', 'opacity': 'show'}, 250).addClass('currentChild'); 
}); 

E qui è una parte del mio codice HTML, leggermente semplificata per una migliore leggibilità (non molto bella lo so, ma ho solo un controllo limitato sul output HTML):

<div class="col_left collapse"> 
    <ul class="radio_list" rel="7"> 
     <li class="onglet level0" rel="group1"> 
      <span class="onglet level0"> 
       <input type="radio" /> 
        <label>Services Pratiques</label></span> 
      <input type="hidden" value="1"> 
     </li> 

Grazie in anticipo.

+1

Sei sicuro di non legare la funzione due volte in qualche modo? – NOtherDev

+0

@A .: Io non la penso così: questa è l'unica volta che uso ".click()" nella mia pagina, e anche l'unica volta che modifico questo nome di classe. Ho anche provato ad usare altri nomi di classe senza risultati migliori. – s427

+0

@A .: In realtà avevi ragione! Sto lavorando con un framework (Prado) che non conosco molto bene e non ero a conoscenza del fatto che il file JS fosse stato incluso due volte nella testa HTML. Correggere questo ha risolto il problema. Grazie! – s427

risposta

12

Problema risolto: il file JS è stato effettivamente incluso due volte nella testina HTML, che ha causato l'attivazione della funzione due volte ad ogni clic.

+0

Dopo aver sbattuto la testa contro la tastiera per circa un'ora, il tuo commento lo ha fatto per me ... l'ho incluso due volte. Ughhhhh –

2

Avevo un problema simile sul mio sito, e ho scoperto che avevo accidentalmente duplicato il gancio della levetta di comando fino in fondo, quando per prima cosa scherzavo con esso. Oops! Assicurati di cercare doppie chiamate!

1

Ho avuto un problema simile a fare questo:

html:

<a>JS-link</a> 

js:

$('a').click(function(event) { 
    ... my stuff ... 
    # Forgot to do event.preventDefault(); !! 
} 

risultati in scatti essere registrati due volte!

1

Ho avuto lo stesso problema e ho realizzato che avevo accidentalmente legato la funzione due volte. Originariamente intendevo spostare il codice da un file javascript a un altro, ma ho lasciato accidentalmente l'originale al suo posto.