如何在按钮单击时获得上表？答案

【问题标题】：How can I get the above table on button click?如何在按钮单击时获得上表？
【发布时间】：2012-03-15 19:36:37
【问题描述】：

这与this question 非常相似，但它不适用于我。我也看过this 和this，但还是不行。

我需要获取点击按钮上方的表格 ID。
如果我单击顶部按钮（删除请求 div），我将获得表 t1 ID。

我的代码如下所示：

<table id="t1"></table>

<div class="bulk_action">
  <div title="Remove requests" class="trash_iconset_grey_16px removeRequest"></div>
  <div title="some other button" class="abc"></div>
</div>

<table id="t2"></table>

<div class="bulk_action">
  <div title="Remove requests" class="trash_iconset_grey_16px removeRequest"></div>
  <div title="some other button" class="abc"></div>
</div>

JS代码

jQuery('.removeRequest').live ('click', function(){
  var div_obj = jQuery(this).closest('div');
  //alert(jQuery(div_obj).attr('class')); //<-- this works

  var tbl = jQuery(div_obj).prev('table:first'); // <-- This is not working
  alert(jQuery(tbl).attr('id'));
});

谁有解决这个问题的建议？

【问题讨论】：

标签： jquery

【解决方案1】：

通过转到按钮的父级，您可以请求最近的表：

jQuery('.removeRequest').live('click', function(){
  var div_obj = $(this).parent();
  var tbl = div_obj.prev('table');
  alert(tbl.attr('id'));
});

http://jsfiddle.net/XNWsy/1/

【讨论】：

工作就像一个魅力！谢谢队友:)
正如我在回答中所说，您不需要将div_obj 包含在$() 中，它已经是一个jquery 对象了！！！请参阅updated jsFiddle 作为它有效的证据:)

【解决方案2】：

在查找表格时，您不必为 div 构造新的 jQuery 对象。它已经是一个 jQuery 对象。我的意思是，使用这个：

var tbl = div_obj.closest('table'); 
alert(tbl.attr('id'));

【讨论】：

【解决方案3】：

如果我理解正确，这可能会起作用：

jQuery('.removeRequest').live ('click', function(){
    var tbl = jQuery(this).closest("table");
    alert(jQuery(tbl).attr('id'));
});

【讨论】：

【解决方案4】：

如果您的标记结构始终相同，您可以简单地使用.prev，

DEMO

jQuery('.removeRequest').live ('click', function(){
  var div_obj = jQuery(this).closest('div');
  alert(jQuery(div_obj).attr('class')); //<-- this works

  var tbl = jQuery(this).closest('.bulk_action').prev(); // <-- Will get you the table
  alert(tbl.attr('id'));
});

或者如果标记可能在 div 和 table 之间有一些元素，则使用.closest('table')，如下所示，

DEMO

jQuery('.removeRequest').live ('click', function(){
  var div_obj = jQuery(this).closest('div');
  //alert(jQuery(div_obj).attr('class')); //<-- this works

  var tbl = jQuery(this).closest('.bulk_action').prev('table'); // <-- Will get you the table
  alert(jQuery(tbl).attr('id'));
});

注意：如果您使用的是 jQuery 1.7 版，请使用 .on；对于旧版本，请使用 .delegate。

使用.on（适用于 jQuery v1.7）

jQuery(document).on('click', '.removeRequest', function(){

使用.delegate（对于旧版本）

jQuery(document).delegate ('.removeRequest', 'click', function(){

PS： 将 jQuery(document) 替换为任何包装 div 和表格的包装选择器。

【讨论】：