2016-11-23 93 views
0

我有一个常见问题页面(纯HTML)。问题有css class .pageSubtitle,答案有两个类:.p1和.p2。这个例子是:答案在常见问题页面上的问题下折叠

<p class="pageSubtitle">Which Award should I apply for?</p> 
<p class="p1">Centers that wish to be recognized for adhering to Guidelines and their Quality Programs and their Processes should apply for <span style="font-weight: bold;">The Center of Excellence in Life Support Award.</span> 
These programs must meet or exceed criteria in the following categories: 
</p> 

<p class="p2">o Systems Focus</p> 
<p class="p2">o Environmental Focus</p> 
<p class="p2">o Workforce Focus</p> 
<p class="p2">o Knowledge Management</p> 
<p class="p2">o Quality Focus</p> 
<p class="p2">o Process Optimization</p> 
<p class="p2">o Family Focus</p> 

在此FAQ页面,用户希望有问题下倒塌的答案,当你点击一个问题下出现的答案。我怎样才能做到这一点?预先感谢您的任何帮助。

+1

下面添加类P2另一个隐藏的div当DIV是悬停显示它使用JavaScript或jQuery的 – coriano35

+0

感谢您的关注和帮助块。但我在jquery和js中很新。你可以添加一些代码吗? – alenan2013

回答

0

我终于找到了工作正常解决方案:

<script type="text/javascript"> 
$(document).ready(function(){ 
$('.p1, .p2, .p3, .p4').hide(); 
$('.pageSubtitle').click(function(){ 
$(this).nextUntil('.pageSubtitle').toggle(); 
}); 
}); </script>