0

我在一个网站上工作,你可以在这里临时找到。您会注意到,如果您单击任何可扩展元素,它会完美运行,但是当按下“全部折叠”按钮时,持有赞成和反对图像的 div 元素会从所有列表项中消失,我无法弄清楚我的内容m做错了(我是jQuery n00b!),js代码如下:

/* Full list expansion functionality */
$('#expandList')
.unbind('click')
.click( function() {
    $('.collapsed').addClass('expanded');
    $('.collapsed').children().show('medium');
})
/* Full list collapse functionality */
$('#collapseList')
.unbind('click')
.click( function() {
    $('.collapsed').removeClass('expanded');
    $('.collapsed').children().hide('medium');
})
4

2 回答 2

3

.children()没有选择器会选择所有孩子,包括<div>带票的 s。

在单个项目的切换脚本中,您正在使用

$(this).children('ul').toggle('medium');
于 2013-03-10T16:17:18.723 回答
1
$('.collapsed').children().hide('medium');

这行代码找到这个元素中的所有子元素并隐藏它们,所以它包含了你的 div

看HTML

<ul id="expList">
 <li class="collapsed expanded">
       <div id="upvoted" style="display: inline-block;"><a href="#"><img src="img/votes/upvote.png" alt="upvote" width="14" height="14"></a></div>
      <div id="downvoted" style="display: inline-block;"><a href="#"><img src="img/votes/downvote.png" alt="downvote" width="14" height="14"></a></div> | SNOW KAYAKING
  //You want to hide only this                      
  <ul style="display: block;">

  </ul>
</li>

看你的代码

 /* Full list collapsion functionality */
    $('#collapseList')
    .unbind('click')
    .click( function() {
        $('.collapsed').removeClass('expanded');
        $('.collapsed').children().hide('medium');
    })

您可以更改代码以仅选择UL元素并将其隐藏:

$('.collapsed ul').hide('medium');

或者

$('.collapsed').children().not("#upvoted,#downvoted").hide('medium');
于 2013-03-10T16:27:30.413 回答