0

我一直在努力解决我一段时间以来一直在尝试创建的功能。这里的想法是用户看到小缩略图+标题,以及发布者信息。然后,他们可以单击标题以扩展至文章,或单击“评论”链接直接扩展至对文章的评论。或者,如果他们愿意,他们可以通过单击标题(展开到文章)来查看评论,然后点击查看评论(展开到评论)。最后,一个模块化但灵活且功能强大的打开/关闭系统可以查看最新消息。

这是我一直在做的事情:(我把我所有的代码放在一个地方,这样任何人都可以更容易地查看)http://notedls.com/pointtest.html

这就是我的目标,但它远非我想要的;(它使用 jQuery 1.6 插件,1.8 已经发布,但我远不是这方面的大师或专家,我认为我做不到从头开始构建。我已经编辑了这个插件让它像这样工作,但正如你所看到的,AUTHOR 和 Comments 开始让粉丝大吃一惊;;这是因为代码调用了“A TAG”对于标题;这是标题。

有谁知道实现我所设想的更简单的方法或可能修复此当前代码的方法?在这一点上我很绝望;;

4

2 回答 2

0

像这样的东西:?

http://jsbin.com/elawu

替代文字

这是一架手风琴。每个“第一个元素”或标题都是一个 div。该标题中包含文章标题、作者和列出该文章评论数量的可点击范围。

每个“第二个元素”,或手风琴的内容部分,也是一个 div。在该 div 中有一个文章内容 div 和一个评论 div。在评论 div 中有一个评论标题,再次可点击,还有另一个内容 div。层次结构如下所示:

<div id='outer-accordion'>
   <div class='header'>
      <p>Article headline</p>
      <p>by: Author</p>
      <p><span class='clickable'># comments</span></p>
   </div>
   <div class='content'>
      <div class='article'>...</div>
      <div class='comments'>
        <p><span class='clickable'># of comments</span></p>
        <div class='comment-content'>
           comment #1
           comment #2
           ...
        </div>
      </div>
   </div>

   ....

当页面启动时,所有评论内容 div 都通过 隐藏,$('div.comments div').hide(); 并且手风琴也被设置,手风琴onaccordionchangeonaccordionchangestart事件被绑定。最后,为评论链接注册一个点击事件。

如果您单击标题上的任意位置,它会弹出打开相关的手风琴内容选项卡。如果单击标题中的评论链接,它会打开手风琴,在内容 div 中打开评论 div。

每次打开手风琴选项卡时,标题中的评论链接都会隐藏。每当手风琴选项卡关闭时,标题中的评论链接就会显示出来。

单击手风琴内容 div 中的评论链接,切换实际评论。

于 2010-04-07T05:26:06.287 回答
0

哦,我觉得我明白了

$('.author').click(function() {
    $(this).parent().find('.authordiv').toggleClass('hidden');
});
$('.comments').click(function() {
    $(this).parent().find('.commentsdiv').toggleClass('hidden');
});

并使用隐藏的 CSS 类

.hidden {
    display:none;
}
于 2010-04-07T00:25:41.870 回答