0

我能够成功地将名为 test.html 的页面中的内容加载到名为 page.htm 的页面中：

$(document).ready(function(){ 
     $("#reveal").load("test.html");
});

我在调用的 page.htm 中放置了一个空 div#reveal并加载内容 - 没问题。

在 test.html 中，我有两个 div 类，分别指定文章标题和文章内容：.artTitle 和 .artContent。在 page.html 的 css 文件中，我有 display:hidden .artContent- 所以所有显示的是.artTitles. 然后我想.artContents通过切换点击来显示。

我能够让这个 jQuery 进程内联工作（在同一页面中），但在加载 html 时会中断。加载我缺少的问题是什么 - （非常绿色的新手）？

4

3 回答 3

1

好吧，我不是 jQuery 专家。事实上，我来到这里是希望对本质上相同的问题有一个明确的答案。已经给出的答案帮助我指出了正确的方向......这是我的解决方案......

我假设您有一些 jquery 函数，看起来类似于，

 $('.trigger').click(function() { $('.artContents').toggle(); });

通过 .load() 加载的 HTML 包含要单击的 .trigger ，它将切换 .artContents ，是吗？尝试，

$(document).on('click','.trigger', function() { $('.artContents').toggle(); });

我真的希望这会有所帮助。我和你一起在“非常绿色的新手”阵营，但这对我有用。我无法准确解释它为什么起作用。也许别人可以。

于 2012-08-08T08:21:39.257 回答
1

罪魁祸首可能是切换功能，而不是加载功能。您可能会绑定到在内容加载之前不存在的元素。您需要使用委托语法on()来将侦听器绑定到 #reveal 或其他祖先。

于 2012-05-24T17:51:11.940 回答
0

You need to use live event like following:

$('body').on('click', '.artTitles', function() { // binding live click to upcoming elements
   var self = this; // keeping reference to clicked title, because this will not catch into the hide callback function due to different scope
   $('.artContents:visible').hide( // hiding visible contents
    function() { // callback function
      $(self).closest('.artContents').show(300); // show content corresponding to title
   });
});
于 2012-05-24T18:12:05.847 回答