如何在jQuery中使用CSS'background-image'属性绑定图像上的click事件

Question

这是我的小提琴链接

我想我的问题很清楚标题本身.不过,我正在寻找的是一种click在使用css background-image属性添加的图像上绑定事件的方法.

我知道,我可以通过简单地将标签放在盒子上然后处理所需的事件来实现类似的功能(通过这种方式或这种方式将图像放置在输入字段上),但这种方式似乎不太灵活,输入字段不同宽度和高度,或者包装div没有作为其属性.<img>inputposition:relative;

如果background-image无法在加载的图像上添加事件,那么如何使后一种方法更加灵活.

希望我已经清楚地表达了我的问题.

谢谢.

Answer 1

这样的东西似乎也有效:

$('.cross').click(function(e) {
  var mousePosInElement = e.pageX - $(this).position().left;
  if (mousePosInElement > $(this).width()) {
     $(this).val(''); 
  }
});

链接到示例