0

我目前正在研究我的新作品集。要检查我遇到的问题，您可以访问http://www.zeiteffekt.de/relaunch/#mmd并单击“详细信息”。会发生什么情况是通过 ajax 加载一个新的 html 文件的滑动切换效果。

$(".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;
      });
    });

我的问题如下：我在 ajax 加载的 html 文件中有一个简单的“关闭”链接，它根本不会切换 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 文件中不起作用。我希望你能帮助我。

干杯，蒂姆

4

2 回答 2

1

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

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

于 2013-01-31T18:04:27.627 回答
0

我没有使用过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”绑定方法时，我总是需要至少有一个元素与 DOM 中的选择器匹配，以便它绑定到未来的元素。我可能使用不正确，所以我愿意更正:)

于 2013-01-31T19:29:28.773 回答