我正在尝试使用click事件来切换不是所选项目的子项或父项的元素。我需要使用＆＃34;这个＆＃34;因为我有几个不同的元素，我想使用包含相同类的相同jQuery点击事件。我已经尝试了其他所有可以找到的解决方案，但它们似乎都没有为我工作。
这是HTML：
<div class="container">
<div class="row name-header">
<span class="col-xs-12">Tracy King</span>
</div>
<div class="center" id="portrait-row">
<img class="myFace" src="images/myface.jpg" alt="portrait">
</div>
<div class="col-xs-12 col-lg-8 col-lg-offset-2">
<div class="row-panel">
<p>About Me</p>
</div>
</div>
<div class="col-xs-12 col-lg-8 col-lg-offset-2">
<div class="content-panel">
<p>"Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore
veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim
ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia
consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque
porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci
velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore
magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum
exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi
consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit
esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo
voluptas nulla pariatur?"
</p>
</div>
</div>
<div class="col-xs-12 col-lg-8 col-lg-offset-2">
<div class="row-panel">
<p>Code Samples</p>
</div>
</div>
<div class="col-xs-12 col-lg-8 col-lg-offset-2">
<div class="content-panel">
<p>"Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore
veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim
ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia
consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque
porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci
velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore
magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum
exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi
consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit
esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo
voluptas nulla pariatur?"
</p>
</div>
</div>
<div class="col-xs-12 col-lg-8 col-lg-offset-2">
<div class="row-panel">
<p>Sample Apps</p>
</div>
</div>
<div class="col-xs-12 col-lg-8 col-lg-offset-2">
<div class="content-panel">
<p>"Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore
veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim
ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia
consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque
porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci
velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore
magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum
exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi
consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit
esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo
voluptas nulla pariatur?"
</p>
</div>
</div>
<div class="col-xs-12 col-lg-8 col-lg-offset-2">
<div class="row-panel">
<p>Other Projects</p>
</div>
</div>
<div class="col-xs-12 col-lg-8 col-lg-offset-2">
<div class="content-panel">
<p>"Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium
doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore
veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim
ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia
consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque
porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci
velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore
magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum
exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi
consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit
esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo
voluptas nulla pariatur?"
</p>
</div>
</div>
</div>
这是我尝试使用的最后一段jQuery：
$(document).on("click", ".more", function(event){
event.preventDefault();
$(this).closest('p').next('.show-more').toggle();
}）;
我更新了fiddle以显示正在运行的代码。每次选择行面板时，我都需要让内容面板滑动切换。提前谢谢！
答案 0 :(得分：2)
试试这个：
$(this).parent().next().children('.content-panel').slideToggle( 800 );
'.content-panel'实际上并不需要，但为了特殊性而添加。
因为您的代码结构非常简单，所以更容易遍历，然后再次退回。
答案 1 :(得分：0)
试试这个：
$(document).on('click', '.your-class', function () {
if ($(this).hasClass('active')) {
$(this).removeClass('active');
// -
$(this).slideUp();
} else {
$(this).addClass('active');
// and apply animation styles to a class or animate with a code
$(this).slideDown();
}
return false;
});