2009-06-11 8 views
0

J'essaye d'écrire jquery-plugin pour table.jQuery table dynamique live cliquez sur le plugin

J'ai 2 tables dynamiques de serveur:

(function($) { 
 
    $.fn.smplPlugin = function() { 
 
     return this.each(function() { \t \t 
 
     $this = $(this); 
 
     $this.find("td").live('click', function() { 
 
      alert($this.attr('id') +" "+ $(this).parent().attr('id')); 
 
     }); 
 
     }); 
 
    }; 
 

 
    $(document).ready(function() { 
 
     $("#first_column").smplPlugin(); 
 
     $("#second_column").smplPlugin(); 
 
    }); 
 

 
})(jQuery);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script> 
 
<div id="first_column"> 
 
    <table> 
 
    <tr id="f1"> 
 
     <td class="select">some text</td> 
 
     <td class="name">some name</td> 
 
    </tr> 
 
    <tr id="f2"> 
 
<!-- 
 
     .... 
 
     more same rows 
 
     .... 
 
--> 
 
    </tr> 
 
    </table> 
 
</div> 
 

 
<div id="second_column"> 
 
    <table> 
 
    <tr id="s1"> 
 
     <td class="select">some text</td> 
 
     <td class="name">some name</td> 
 
    </tr> 
 
    <tr id="s2"> 
 
<!-- 
 
     .... 
 
     more same rows with differents id's 
 
     .... 
 
--> 
 
    </tr> 
 
    </table> 
 
</div>

je veux ajouter événement cliquez sur <td>.

lorsque je clique sur <td> sur la première ou deuxième table, je reçois toujours le même, dernier identifiant d'objet, il est: deuxieme_colonne, mais différent premier ou deuxième rangées id

click sur [première colonne] [id tr = f1] [td class = nom] sortie f1

cliquez sur la seconde colonne [] [tr id = s2] [td class = select] sortie second_class s2

et ainsi de suite. Des idées?

+1

À partir de jQuery 1.7, .live() est obsolète pour .on() Voir http://api.jquery.com/on/ – bpeterson76

Répondre

0

Essayez cette

(function($) { 
    $.fn.smplPlugin = function() { 
    $("td",this).live('click', function() { 
     alert($(this).parent().attr('id') +" "+ $(this).parents('div').attr('id'));   
    }); 
    }; 
})(jQuery); 
1

Votre ligne $this = $(this); doit être var $this = $(this);.

Le premier crée une variable globale appelée $this et attribue une nouvelle valeur/référence à chaque itération de chaque boucle - l'utilisation de la variable pointe donc toujours vers le dernier élément itéré. Ce dernier code crée une variable dans la fermeture de votre corps de boucle - donnant ainsi à chaque click-handler une référence à sa ligne.

Questions connexes