Question

我知道这个问题已被问过几千次，但我似乎无法弄明白我的问题。我只需要另外一双眼睛看看我做错了什么或我错过了什么。

这是我的代码：

<div class="image-container">
  @foreach (var image in Model)
  {
    <a href="#" class="returnImage" data-url="@Request.Url.GetLeftPart(UriPartial.Authority)@image.Url">
      <img src="@image.Url" id="UploadImage" data-source="@image.Url" width="200" height="200">
    </a>
  }
</div> 

<script>
  $(document).ready(function () {
    $("div.image-container").on("click", ".returnImage", function(e) {
      var urlImage = $(this).attr("data-url");
      window.opener.updateValue("cke_72_textInput", urlImage);
      window.close();
    });
  });
</script>

使用FireBug进行调试时没有显示任何错误，当我在＆＃34; on click＆＃34;上放置断点时功能，永远不会被击中/永远不会被击中。我在这里缺少什么？

Answer 1

可能发生的事情是<a>标记在您点击它们时优先，抑制您对div.image-container元素的点击事件。

如果您打算让用户点击整个容器本身，请尝试为模型中的每个图像使用除<a>标记之外的其他内容。

如果您打算在<a>内的每个div.image-container标记上放置一个点击处理程序，那么您的jQuery事件行应该是这样的：

$("div.image-container a").click(function(e) {

Answer 2

试试这个：

$(".returnImage").on("click", function(e) {
  //whatever action code
});

Answer 3

当没有任何东西被触发时，可能是你的弹出窗口阻止程序认为你的脚本试图扼杀你的浏览器并因此阻止它，特别是因为它是一个包含在功能中的<a>锚标记这将触发浏览器解释的默认链接行为。下面的代码是您的，添加了.preventDefault()行为例程，以防万一。编辑：更新编码以更准确地定位您想要的DOM元素（如其他答案所示）。

preventDefault API

  $(document).ready(function () {
    $(".returnImage").on("click", function(e) {
      e.preventDefault();
      var urlImage = $(this).attr("data-url");
      window.opener.updateValue("cke_72_textInput", urlImage);
      window.close();
    });
  });

点击不点火的jQuery

3 个答案: