Question

我正在研究我的新产品组合。要检查我遇到的问题，您可以转到http://www.zeiteffekt.de/relaunch/#mmd并点击“详细信息”。会发生什么事情会产生一个幻灯片切换效果，其中一个新的html文件通过ajax进行了加密。

$(".show_details").click(function(){            
        $("#mmd_details").slideToggle("slow");
    });

$(document).ready(function() {
      // select all the links with class="load_content", when one of them is clicked, get its "href" value
      // adds a "loading..." notification, load the content from that URL and
      $('a.load_content').click(function() {
        var url = $(this).attr('id');
        $('#mmd_details').html('Laden...').load(url);
        return false;
      });
    });

我的问题如下：我在html文件中有一个简单的'close'链接，它由ajax加载，它根本不会切换div容器。当我点击最初的“详细信息”链接时，它将关闭div。加载的html中的相同链接不会这样做。

当在ajax加载的html文件中使用scrollTo时，它也不起作用。

这是滚动功能：

$(document).ready(function() {
        $(".scroll").click(function(event){     
        event.preventDefault();
        $('html,body').animate({scrollTop:$(this.hash).offset().top}, 700);
        });
    });

我完全不知道为什么jquery脚本不能在ajax文件中工作。我希望你能帮助我。

干杯，添

Answer 1

当页面加载完成后，jQuery将它的事件处理程序绑定到dom。如果之后添加到dom，请通过ajax说，jQuery不知道新元素。

根据您的jQuery版本，您需要使用“on”或“live”。

Answer 2

我没有使用jQuery.load()，但文档（http://api.jquery.com/load/）并未表明评估加载的HTML中的任何内联脚本。

它确实指定您可以将回调函数传递到load()，我想这是您最好的选择：

$('#mmd_details').html('Laden...').load(url, function() {
  $(".scroll").click(function(event){     
     event.preventDefault();
     $('html,body').animate({scrollTop:$(this.hash).offset().top}, 700);
  });
});

每当我使用jQuery的'on'bind方法时，我总是需要至少有一个与DOM中的选择器匹配的元素才能绑定到未来的元素。我可能会错误地使用它，所以我愿意更正：）

jquery：slideToggle和scrollTo在ajax加载的html文件中不起作用

2 个答案: