Получите attr ('id') от <td> с помощью jQuery

Question

У меня есть следующий код, и checkb начинается с checkb01 на chekb342.

<tr> 
    <td class="specs_under">Specs</td> 
    <td id="checkb77" class='checkb'><input type="checkbox" id="add_remove77" class="change_image77"/></td> 
    <td class="specs_under_value" id="specs_unit77">1</td> 
    <td rowspan="13" class="specs_under_value" id="specs_itempr77">15</td> 
    <td class="specs_under_value" id="specs_quantity77">&nbsp;</td> 
    <td class="specs_under_value" id="specs_packageprice77">0.125</td> 
</tr> 

Я попытался с помощью этого кода

$(document).ready(function(){ 
    $(".checkb").toggle(function() { 
     var cid = $(this).attr('id'); 
     alert('id'); 

    },function() { 
     alert('checkbox unchekced'); 

    } 

Как получить значение идентификатора в <td> соответствующий флажок щелчки с помощью Jquery

Благодаря Жан

Ребята мне нужно для получения значения id при щелчке по флажку, а не флажком id

Answer 1

$(':checkbox').toggle(function() { 
    var cid = $(this).attr('id'); 
    alert(cid); 
}, function() { 
    alert('checkbox unchekced'); 
}​);​ 

Answer 2

Вы можете получить значение либо прикрепления обработчиков событий непосредственно на флажок (toggle() автоматически отменяет проверку действия по умолчанию, поэтому мы используем change() здесь):

$('.checkb :checkbox').change(function(){ 
    if(this.checked){ 
     // Do somethin' 
     alert(this.id); 
    } else { 
     // Do something else 
     alert('Unchecked!'); 
    } 
}); 

Если вы действительно хотите использовать toggle, этот код работает, несколько:

$(".checkb").toggle(function() { 
    var cid = $(this).children(':checkbox').attr('id'); 
    alert(cid); 
}, function() { 
    alert('checkbox unchekced'); 
}); 

Однако, из-за отмены действия упомянутого выше по умолчанию , флажок никогда не может быть проверен.

Answer 3

Простейшее способом я могу думать прямо сейчас добавления отн атрибут ввода тега и идентификатор к т.р. тэгом как:

<tr id="row77"> 
    <td class="specs_under">Specs</td> 
    <td id="checkb77" class='checkb'><input type="checkbox" id="add_remove77" class="change_image77" rel="row77"/></td> 
    <td class="specs_under_value" id="specs_unit77">1</td> 
    <td rowspan="13" class="specs_under_value" id="specs_itempr77">15</td> 
    <td class="specs_under_value" id="specs_quantity77">&nbsp;</td> 
    <td class="specs_under_value" id="specs_packageprice77">0.125</td> 
</tr> 

, а затем использовать:

<script type="text/javascript"> 
    $('checkbox:checked').each(function() { 
     var id = $(this).attr('rel').substr(3,$(this).attr('rel').length); // 77 
     var specs_packageprice = $('#'+$(this).attr('rel')+' #specs_packageprice'+id).html(); //0.125 
     // More code... 
    } 
</script> 

Я также думаю, что вы можете упростить это alot ...

Answer 4

Если вы используете jquery 1.4.2 (самая новая версия, я думаю), я бы подумал об использовании функции delegate(). Что-то вроде этого:

$(function() { 
    $("table").delegate(":checkbox", "click", function() {alert($(this).attr("id");}) 
}) 

Очевидно, что вы можете делать все, что хотите, в обработчике кликов.

Что делает делегат, прикрепляется к таблице, содержащей все ваши флажки. Каждый раз, когда нажимается элемент ввода в таблице, обработчик запускается. Если у вас есть другие входы в таблице, вам нужно будет убедиться, что у вас есть элемент, который вы хотите. Вы можете проверить, установлен ли тип. Я бы рекомендовал дать вашей таблице идентификатор и заменить «таблицу» идентификатором в приведенном выше.

В качестве альтернативы вы можете прикрепить обработчик кликов ко всем входам в таблице, но это, вероятно, не будет проще и, скорее всего, будет медленнее.

Наконец, если вы не используете 1.4.2, но используете как минимум 1.3, вы можете использовать live() вместо делегирования.

Answer 5

Если вы пытаетесь получить идентификатор прилагаемого td (а не самого флажка), рассмотрите возможность использования функции .closest().

например:

$(':checkbox').change(function(){ 
    var id = $(this).closest('td').attr('id'); 
    alert(id + ' : ' + this.checked); 
});