Question

我的问题是我在加载的div中有很多链接，加载后它们无法点击。我看到了一些类似的问题，但无法理解如何在我的问题中使用它。

我正在尝试制作lightbox种效果（没有插件只是简单地使用.load（）将内容加载到div，一切正常但加载div中的链接。

<div class="post">
  <a class="layer" href="/post/123 #the_post>*">
</div>

$('.layer').click(function(e) {
      e.preventDefault();
      var path = $(this).attr('href');
      $('#overlay_content').load(path, function(){
          $(".media").each(function(){
              var medhei = $(this).height();
              $(this).css("line-height", medhei + 'px');
          });
      });
});

也尝试了类似的东西，但没有用：

$('.layer').live('click', function(e) {
      e.preventDefault();
      var path = $(this).attr('href');
      $('#overlay_content').load(path, function(){
          $(".media").each(function(){
              var medhei = $(this).height();
              $(this).css("line-height", medhei + 'px');
          });
      });
});

Answer 1

想出一个快速的解决方案，希望它能帮助那些有类似问题的人。简单来说，我只是点击链接打开它的href属性所在的位置。

$('.layer').click(function(e) {
      e.preventDefault();
      var path = $(this).attr('href');
      $('#overlay_content').load(path, function(){
          $(".media").each(function(){
              var medhei = $(this).height();
              $(this).css("line-height", medhei + 'px');
          });
          $("#overlay_content a").click(function(){
              window.location=$(this).attr('href');
              return false;
          });
      });
});

Answer 2

使用.on()方法（jq 1.7＆gt;）委托事件的正确语法是：

$(document.body).on('click','.layer',function(e) {...});

现在你不应该委托给身体级别，而是委托加载新元素的最近的静态容器。所以我想：

$('#overlay_content').on('click','.layer',function(e) {...});

Answer 3

您想要的是委派的事件处理程序，但不推荐使用.live，请尝试：

$(container).on("event","link_selector",function() {
  // Your stuff
});

例如：

$(document).on("click",".layer",function(e) {
   e.preventDefault();
   var path = $(this).attr('href');
   $('#overlay_content').load(path, function(){
       $(".media").each(function(){
           var medhei = $(this).height();
           $(this).css("line-height", medhei + 'px');
       });
    });
});

链接在动态div内部不起作用（使用jquery .load（）加载）

3 个答案: