从HTMLTableRowElement中的特定单元格获取子元素并隐藏/删除它们

Get child elements from a specific cell in an HTMLTableRowElement and hide/remove them?

本文关键字：隐藏 元素 删除 获取 HTMLTableRowElement 单元格      更新时间：2023-09-26

我正在使用Telerik的MVC网格处理一些自定义ajax功能，并试图根据特定标准隐藏/删除单元格的子元素，我在这里发现了一个类似的问题：Telerik MVC网格基于其他列值生成列红色，但无法正常工作。

基本上，当行在网格中被数据绑定时，此事件会触发：

 function onRowDataBound(e) {
        if (e.dataItem.Status == "Submitted") {
            $.each(e.row.cells, function (index, column) {
                alert(column.innerHTML);
                //var $header = $(column).closest('table').find('th').eq($(column).index());
                //if(header text == "Actions)
                //{
                     //Get the <a> child elements in the 'Actions' column whose class contains t-grid-Edit, 
                     //t-grid-edit, t-grid-Delete, or t-grid-delete and set their display to none, add a css class, and remove the element entirely
                //}
            }
        }
    }

到目前为止，它的工作原理是，我可以获取并迭代行中的每一列，但我不确定此时该怎么办，我发现了这个问题。我如何从表单元格（td）中获取相应的表头（th）？检查以确保列名为Actions，但我无法使其工作。我不知道如何将javascript HTMLTableCellElement对象转换为jQuery对象，以便使用我更熟悉的语法。

以下是我之后需要做的：

  1. 获取类为"Actions"的列中的子元素（必须按列标题名称而不是单元格索引，因为列数可以更改）包含t-grid-Edit、t-grid-Edit、t-grid-Delete或t-grid-Delete

  2. 采取这些元素和（这些操作中的每一个都将在使用类似设置的不同页面上使用）：

    • a。将元素的显示样式设置为无

    • b。在名为"隐藏"的元素中添加一个类

    • c。从代码中完全删除元素

如何将上述功能放入我的onRowDataBound函数中？

谢谢你SO=）。

我通过大量的游戏解决了这个问题：

function onRowDataBound(e) {
        if(e.dataItem.Status == "Submitted"){
            var $row = $(e.row);
            $.each($row.children("td"), function (index, column) {
                var $column = $(column);
                var $headerText = $column.closest('table').find('th').eq($column.index()).children(".t-link").text();
                if ($headerText == "Actions") {
                    $.each($column.children("a.t-grid-delete, a.t-grid-Edit"), function (subIndex, link) {
                        $(link).remove();
                    });
                }
            }); 
        }
    }
相关文章：