Kendo ui 查找在列中为所有行添加的图像，并将单击事件附加到该图像

我正在使用剑道ui网格。我在网格中动态添加了列。我已经创建了网格中的第一列，如下所示，以便在其中显示图像。我可以看到网格中的图像。 我在数组中添加了列名，并将它们传递给网格中的columns参数

colHeader.push（{template:}）

colHeader是数组

根据行的数据，单击图像打开的url是不同的。 因此，我看到的唯一选项是循环所有行，找到特定列，然后找到单元格，然后将url附加到图像的单击事件。

---

希望这能说明问题。请对此提出建议。

这可能不是推荐的方法，但我会使用web网格（与MVC包装相反），使用自定义命令列，然后更改命令按钮的样式以使用您的图像

像这样：

 // rest of grid ommitted

        groupable: true,
        sortable: true,
        pageable: {
            input: true,
            refresh: true,
            messages: {
             display: '{2} Items'
            }
        },
        columns: [
        {
          title: ' ',
          field: 'RowId',            
          command: [{ name: 'hmm', text: ' ', click: viewRowInfo }],
        }
     ]);

然后单击处理程序：

function viewRowInfo(e) {
    e.preventDefault();

    //get data item for row
    var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
}

在样式表中：

.k-grid-hmm { border:none !important; width:32px; height: 32px; background-color: transparent !important; background-image: url(icons/your-image.png) !important; }

在网格中使用自定义命令时，Kendo会自动添加一个名为“.k-grid-”+您为命令指定的名称的类

---

希望这有助于…

为什么需要迭代和修改它，而不是直接用事件生成图像

网格中可能有如下列定义：

columns: [
    // Your other columns
    ...
    {
        title :"Image",
        template: "<img src='my_image.gif'/>"
    },
    // More columns
    ...
];

---

请参见第三列使用第一种方法，第四列使用第二种方法的示例。

感谢尼尔·希伯特的回复。我会尝试这种方法。谢谢你的回复。我想循环所有行的原因是我已经动态创建了列。现在我可以看到列中的图像。基于行值单击图像时，将打开一个不同的窗口。所以我想要的是循环所有行，找到第一个包含图像的列，然后在单击图像时指定要打开的url。关于如何做到这一点的任何建议。我在专栏中添加了与上面提到的相同的图像。虽然我并没有为模板添加任何类属性，但我在那个里添加了onclick事件本身。第一列是image列，我动态创建了5列。网格中有10行。每次单击图像都需要根据该行中的特定值打开不同的url/窗口。所以我想，如果有任何方法可以循环所有行，找到第一个带有图像的列（列没有标题或标题），然后为它的onclick事件赋值。请在这方面提供帮助。您能否在JSFIDLE/JSBin中向我们展示一些代码，甚至编辑原始问题，以便我们可以提供直接适用于您的问题的答案。关于行迭代和从第一个单元格获取图像，我如何做，然后为其分配单击事件。请参阅中的其他问题和我的答案

columns: [
    // Your other columns
    ...
    {
        title :"Image",
        template: "<img src='my_image.gif' click='javascript:sayHello();'/>"
    },
    // More columns
    ...
];

columns: [
    // Your other columns
    ...
    {
        title :"Image",
        template: "<img src='my_image.gif' class='.ob-image'/>"
    },
    // More columns
    ...
];

// Set handler
$("#grid").on("click", ".ob-image", function() {
    alert("Hi");
});