检测图像上的点击

Question

我正在尝试动态加载图像并显示它们，如下所示

     var uploader = $('#<%=uploader.ClientId%>').plupload('getUploader');
              uploader.bind('FileUploaded', function (up, file, res) {
              $('#<%=thumbs.ClientId%>').append("<div id=" + file.id + ">
              <a href='Uploads/" + document.getElementById("<%=currentDirectory.ClientId%>").value + "/" + file.name + "'/>
              <img src='Uploads/" + document.getElementById("<%=currentDirectory.ClientId%>").value + "/" + file.name + "' width='70' height='55' data-full='Uploads/" + document.getElementById("<%=currentDirectory.ClientId%>").value + "/" + file.name + "'/></div>");
    });

这是我的标记：

  <div id="thumbs" class="imgContain" runat="server">
  </div>

如果我在 div 上这样做，它会给我一个警报，但不是在图像上而是在 div 上：

  $('.imgContain').click(function () {
    alert('You Clicked Me');
  });

我已经尝试使用这种方式，但它即使在 div 上也没有给我任何警报。

 $('.imgContain a').click(function () {
        alert('You Clicked Me');
 });

那么我该怎么做呢？

Answer 1

你应该使用 on 方法

 $('.imgContain').on("click","a,img", function (e) {
      e.preventDefault();
      alert('You Clicked Me');
 });

Answer 2

确切地知道你的 DOM 是什么样子有点困难，但我猜你是用 .imgContain 类将图像添加到 div 中的。如果你想向这些图像添加点击事件，你可以这样做：

$('.imgContain').on("click", "img", function () {
    alert('You Clicked Me');
});

因为我相信你正在动态添加图像，所以你应该使用 .on() 方法来绑定点击事件，而不是使用 .click()。

注意如果由于某种原因您使用的是以前版本的 jQuery，您可以将 .on() 更改为使用 .live() 。

Answer 3

对于您附加的锚点 ，您需要使用 .live() 以便附加点击事件，例如：

 $('.imgContain a').live("click", function (event) {
      event.preventDefault();
      alert('You Clicked Me');
 });

Answer 4

实时学习 jQuery 中的函数。
并在您的代码中使用它..

jQuery 版本 1.4.1 及更高版本。

因为元素是在页面加载后动态放置在 html 上的。点击功能未绑定。