Question

假设我有以下代码在一组元素后添加可点击图像。每次单击图像时点击处理程序都会触发，这不是我想要的。我想在单击处理程序中使用.hide（）隐藏图像是一种方法，但我无法弄清楚如何在单击处理程序中引用img元素。

帮助？感谢

  $(...)
  .after($('<img src="..."/>')
  .css("cursor","pointer")
  .attr("title","Click here for ...")
  .click(function(){ ... }

Answer 1

将它分成两行可能是最简单和最可读的：

var e = $('<img src="..."/>');
  $(...)
  .after(e)
  .css("cursor","pointer")
  .attr("title","Click here for ...")
  .click(function(){ ... use e here...  }

虽然你可以像我在这个例子中所做的那样使用next：

$('p')
  .after($('<img src="..."/>'))
  .css("cursor","pointer")
  .attr("title","Click here for ...")
  .click(function() { 
      $(this).next().css("border", "solid white 5px");

  })

因此，使用 this 的优点来获取您正在寻找的元素，而不需要任何临时工具。 http://jsbin.com/ulewo

Answer 2

$("#foo").click(function () {
    $(this).hide(); /* This refers to the item(s) being clicked */
})

Answer 3

您可以为图片添加唯一ID，以便获取它：

$(...)
  .after($('<img id="myimage" src="..."/>')
  .css("cursor","pointer")
  .attr("title","Click here for ...")
  .click(function()
  { 
      var img = $('#myimage');
  }

触发点击处理程序后隐藏元素

3 个答案: