使用 jQuery 从 <td> 获取 attr('id')

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3896636/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 16:18:03  来源:igfitidea点击:

Get attr('id') from a <td> using jQuery

jquery

提问by X10nD

I have the following code, and the checkb starts from checkb01 to chekb342.

我有以下代码,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>

I tried using this code

我尝试使用此代码

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

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

    }

How do I get the value of the id in <td>respective checkbox clicks using jquery

如何<td>使用 jquery在相应的复选框点击中获取 id 的值

Thanks Jean

谢谢让

Guys I need to get the value of id when the checkbox is clicked, not the checkbox id

伙计们,我需要在单击复选框时获取 id 的值,而不是复选框 id

回答by Darin Dimitrov

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

回答by Dan Manastireanu

If you are trying to get the id of the enclosing td (not the checkbox itself) consider using the .closest() function.

如果您试图获取封闭 td 的 id(而不是复选框本身),请考虑使用 .closest() 函数。

ex:

前任:

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

回答by Yi Jiang

You can obtain the values by either attaching the event handlers directly onto the checkbox (toggle()automatically cancels the default checking action, so we're using change()here):

您可以通过将事件处理程序直接附加到复选框来获取值(toggle()自动取消默认检查操作,所以我们在change()这里使用):

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

If you really want to use toggle, this code works, somewhat:

如果你真的想使用toggle,这段代码可以工作,有点:

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

However, because of the above mentioned default action cancellation, the checkbox can never be checked.

但是,由于上述默认操作取消,永远无法选中该复选框。

回答by Claudiu

Simplest way I can think of right now is adding a relattribute to the input tag and an id to the tr tag like:

我现在能想到的最简单的方法是在 input 标签中添加一个rel属性,在 tr 标签中添加一个 id ,例如:

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

and then use:

然后使用:

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

I also think you can simplify this alot...

我也认为你可以简化很多......

回答by Sid_M

If you are using jquery 1.4.2 (the newest version, I think), I'd consider using delegate(). Something like this:

如果您使用的是 jquery 1.4.2(我认为是最新版本),我会考虑使用 delegate()。像这样的东西:

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

Obviously, you can do whatever you want in your click handler.

显然,您可以在点击处理程序中做任何您想做的事情。

What delegate does is attach to the table containing all your checkboxes. Anytime an input element in the table is clicked, the handler will fire. If you have other inputs in the table, you'll need to check to be sure you have an element you want. You could check if type is checkbox. I'd recommend giving your table an id, and replacing "table" with the id in the above.

委托所做的是附加到包含所有复选框的表格。每当单击表中的输入元素时,处理程序都会触发。如果表中有其他输入,则需要检查以确保您有想要的元素。您可以检查类型是否为复选框。我建议给你的表一个 id,并用上面的 id 替换“table”。

Alternatively, you can attach a click handler to every input in the table, but that's probably not going to be easier, and will likely be slower.

或者,您可以为表中的每个输入附加一个点击处理程序,但这可能不会更容易,而且可能会更慢。

Finally, if you're not using 1.4.2, but are using at least 1.3, you can use live() instead of delegate.

最后,如果您不使用 1.4.2,但至少使用 1.3,您可以使用 live() 而不是委托。