Question

我想检查当前网格单元格是否是行中最后一个可见单元格。

//accurately confirms if cell is the last cell in the row, assuming there are no "display: none" cells after it
var isLastColumn = $(e.target).closest('td').is(':last-child');

//doesn't work - obviously because last-child gets the cell regardless of visiility
var isLastColumn = $(e.target).closest('td').is(':visible:last-child');

//doesn't work
var isLastColumn = $(e.target).closest('td').is('td.visible:last-of-type');

//doesn't work
var isLastColumn = $(e.target).closest('td').is(':visible:last');

如何查看所选单元格是否是该行的最后可见列？

我正在与以下事件挂钩：

    var grid = $("#@gridName").data("kendoGrid");
    grid.tbody.on('keydown', onGridKeydown)


    function onGridKeydown(e)
    {
        var isLastColumn = $(e.target).closest('td').is(':last-child');
    }

Answer 1

下面有一种更有效的方法可以实现，但它似乎有用，可以告诉你是否在当前行的最后一个可见列中。

考虑到您提及display:none用于隐藏其他列，您应该能够检查当前行中的当前td是否是最后一个可见的td元素。

＆＃13;

$('button').on('click', function(e) {
  var $td = $(e.target).closest('td');

  var isLastColumn = $td.is($td.closest('tr').find('td:visible:last'));
  alert(isLastColumn)
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="table">
  <tr>
    <td>
      <button>
        1
      </button>
    </td>
    <td style="display:none">
      <button>
        2
      </button>
    </td>
    <td>
      <button>
        3
      </button>
    </td>
    <td style="display:none">
      <button>
        4
      </button>
    </td>
  </tr>
  <tr>
    <td>
      <button>
        1
      </button>
    </td>
    <td style="display:none">
      <button>
        2
      </button>
    </td>
    <td>
      <button>
        3
      </button>
    </td>
    <td style="display:none">
      <button>
        4
      </button>
    </td>
  </tr>
</table>
<table id="table2">
  <tr>
    <td>
      <button>
        1
      </button>
    </td>
    <td style="display:none">
      <button>
        2
      </button>
    </td>
    <td>
      <button>
        3
      </button>
    </td>
    <td style="display:none">
      <button>
        4
      </button>
    </td>
  </tr>
</table>

＆＃13;

以下是Fiddle

检查td是否是最后一次可见的td

1 个答案: