2009-06-11 4 views
0

Я пытаюсь написать jquery-plugin для таблицы.jQuery динамическая таблица live click plugin

У меня 2 динамические таблицы с сервера:

(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>

тогда я хочу, чтобы добавить событие щелчка на <td>.

, когда я нажимаю на <td> на первом или на втором столе, я всегда получаю один и тот же, последний идентификатор объекта, это: second_column, но различные первые или вторые строки идентификаторам

нажмите на [первый столбец] [т.р. ид = f1] [тд класс = имя] выходной second_class f1

нажмите на [второй столбец] [тр ID = s2] [тд класс = выбрать] выход second_class s2

и так далее. Любые идеи?

+1

Начиная с jQuery 1.7, .live() устарел для .on() См. Http://api.jquery.com/on/ – bpeterson76

ответ

0

Попробуйте

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

Ваша линия $this = $(this); должна быть var $this = $(this);.

Первый создает глобальную переменную с именем $this и присваивает новое значение/ссылку на каждой итерации вашего цикла. Использование переменной всегда указывает на последний итерированный элемент. Последний код создает переменную в закрытии вашего тела цикла - таким образом, каждый клик-обработчик ссылается на свою строку.

Смежные вопросы