如何将单击事件添加到 jquery 网格中的 img 元素

Question

我有一个jquery网格，我使用格式化程序将img元素添加到网格列值中。我如何将点击事件添加到该元素并根据条件隐藏/显示图像。

{
  name : 'adjust',
  formatter : function (){
    return "<img src='xxx'>";
  }
}

Answer 1

对我来说，最简单的方法是给图像一个类，return "<img class='my_img' src='xxx'>";

然后使用 jquery 使用以下代码：

$ (document).on ('click', '.my_img', function (e) {
    var obj = $ (this);
    if (obj.hasClass ('hide'))
        obj.removeClass ('hide'); // or add a placeholder, etc
    else
        obj.addClass ('hide');
});

'$ (document(.on ('click'， '.my_img'， function (e(....，因为如果在页面加载后添加了任何图像，则 Click 事件仍将适用于这些新图像

之所以使用var obj = $ (this);，是因为根据您在函数中执行的操作，this可能会有所不同。

通过使用上述 coe，当您的图像隐藏时，您将无法再次单击它:)这只是如何添加 Click 事件的示例