我几乎肯定这个问题之前已经得到了解答,但是我问这个问题的原因是因为我不确定如何在不破坏它的情况下将答案应用到我的代码中。我有一个手风琴菜单,它使用标题,段落标签,手风琴结构的div。那么我想要做的是使用手风琴内部的div来显示图像,但事情就是这样:divs用于手风琴的结构。
所以,我要问的是如何让jQuery纯粹地对待这个div 内容而不是结构的一部分?
我很确定答案是使用.not()
,但不确定。我只了解JavaScript和jQuery的基础知识。我真的很抱歉这些人...我是那种通过做而不是通过读书来学习的人。
var headers = ["H1", "H2", "H3", "H4", "H5", "H6"];
$(".accordion").click(function(e) {
var target = e.target,
name = target.nodeName.toUpperCase();
if ($.inArray(name, headers) > -1) {
var subItem = $(target).next();
//slideUp all elements (except target) at current depth or greater
var depth = $(subItem).parents().length;
var allAtDepth = $(".accordion p, .accordion div:not(.exclude)").filter(function() {
if ($(this).parents().length >= depth && this !== subItem.get(0)) {
return true;
}
});
$(allAtDepth).slideUp("fast");
//slideToggle target content and adjust bottom border if necessary
subItem.slideToggle("fast", function() {
$(".accordion :visible:last").css("border-radius", "0 0 10px 10px");
});
$(target).css({
"border-bottom-right-radius": "0",
"border-bottom-left-radius": "0"
});
}
});

<aside class="accordion">
<div class="opened-for-codepen">
<h2>How do I recruit members?</h2>
<div class="exclude image_legend">
<span>Image legend for "How do I recruit members?" section</span>
<br />
<br />
<img src="includes/images/clan/clan-tab.png" height="40px" style="display: inline;" />
<img src="includes/images/clan/clan-bottom-bar.png" height="40px" style="display: inline\;" />
<img src="includes/images/clan/clan-recruit.png" height="40px" style="display: inline-block;" />
<img src="includes/images/clan/clan-tab.png" height="40px" style="display: inline-block;" />
</div>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec quis arcu augue. Donec varius semper interdum. Sed condimentum ipsum enim, a egestas nunc blandit a. Aenean varius dapibus suscipit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Quisque et lectus sapien. Nulla dapibus porta libero ac efficitur. Phasellus condimentum ornare porta. Aliquam erat volutpat. Nullam nec orci vitae felis mattis suscipit consectetur sit amet urna. Nulla lobortis augue ac commodo condimentum. Maecenas
ac dui cursus, congue felis quis, varius elit. Curabitur nulla lacus, dignissim ut pellentesque at, posuere sit amet eros. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec nec sapien diam. Nulla
accumsan viverra tellus sed laoreet. In eleifend nulla libero, vehicula consectetur magna condimentum vitae. Suspendisse non rhoncus justo. Nullam eleifend elit nec neque efficitur, quis fermentum metus pretium. Quisque tellus mauris, molestie in
ultrices eu, tincidunt ut nibh. Fusce eu volutpat felis. Integer ligula nulla, mattis quis pulvinar pharetra, vehicula nec arcu. Vivamus tincidunt nulla a nisi vehicula lobortis. In hendrerit, neque quis convallis lacinia, nisl ipsum varius lorem,
nec laoreet nisi odio vitae est. Nulla vitae diam enim. Suspendisse a dignissim magna. Pellentesque convallis maximus mollis. Nullam tellus est, accumsan sit amet facilisis sit amet, semper sed lorem. Mauris laoreet tortor at odio aliquet, ut porta
lacus rhoncus. Nullam laoreet dolor et velit malesuada feugiat. Vestibulum a erat elementum, hendrerit massa non, ornare enim. Phasellus iaculis diam eros, sit amet dapibus elit finibus id.
</p>
</div>
</aside>
编辑:上面的html是合并的,因为有很多内容要包含所有内容,但是我为你提供了制作手风琴的基本结构
答案 0 :(得分:0)
为您的div分配一个课程(例如&#39; my-class&#39;)
然后使用not:not()来过滤选择
Maybe<T>