Il plug-in jQuery non funziona quando viene chiamato due volte

Question

Conosco il modo in cui ho codificato il plug-in per gestire più istanze. Sono abbastanza sicuro che almeno una delle mie variabili venga sovrascritta da ogni chiamata successiva del plugin. Comunque, ecco il codice del plugin:

$.fn.extend({ 
dependsOn: function($claimer){ 
    $dependent = $(this); 
    $claimer.change(function(){ 
     alert($dependent.attr('id')); 
     var $selected = $('option:selected', this); 
     var pk = $selected.attr('class'); 

     $dependent.removeAttr('disabled'); 
     $dependent.find('option').each(function(){ 
      $hiddenOpts = $dependent.parent().find('.hiddenOptions'); 
      $hiddenOpts.append($(this)); 
      $hiddenOpts.find('option').each(function(){ 
       if($(this).attr('ref') == pk || $(this).hasClass('empty')) 
        $dependent.append($(this)); 
      }); 
     }); 
    }); 
} 
}); 

Quando chiamo $('.something').dependsOn($('.somethingElse'));, funziona benissimo, ma se io lo chiamo di nuovo su altri due elementi, la variabile dipendente $ viene impostato su tale elemento.

Il punto del plug-in è mantenere le caselle di selezione disabilitate finché non viene modificata una casella di selezione precedente. Se ho tre caselle di selezione in una riga e voglio che la prima sia abilitata, la seconda dipende dalla prima e la terza dipende dalla seconda, chiamerei $(second).dependsOn($(first)) e $(third).dependsOn($(second)), quindi la modifica della prima sarebbe abilitata il secondo, ma non il terzo, e cambiare il secondo permetterebbe il terzo.

Ma con il codice corrente, la modifica del primo abilita il terzo, ma non il secondo (come ho detto, penso che sia perché $ dipendente viene sovrascritto e impostato sulla terza cosa dopo aver chiamato dependsOn due volte).

Se non è chiaro, fammi sapere.

Answer 1

Questo perché non si sta definendo una nuova variabile nell'ambito di dependsOf (che viene eseguita utilizzando var $dependent = blah). Invece, stai impostando il valore di $ (this) su una versione globale di $dependent.

Questo è il motivo per cui viene sostituito.

Buona fortuna :)

Answer 2

Il modo in cui si sta dichiarando $dependant sta rendendo un globale variabile , così la prossima volta che la funzione viene chiamata imposta lo stesso globale $dependant al nuovo valore. Prova:

var $dependant = $(this);