在jQuery中,实现多个div的展开和收缩可以通过绑定点击事件并切换其CSS类或直接修改其`display`属性来实现。以下是一个简单的例子,展示了如何使用jQuery来控制一组div的展开和收缩。
你需要确保你的HTML结构是这样的:
```html
标题1
标题2
```
然后,你可以使用以下jQuery代码来实现展开和收缩的功能:
```javascript
$(document).ready(function() {
// 绑定点击事件到所有头部元素
$('.header').click(function() {
// 获取当前点击的头部元素对应的容器
var $container = $(this).closest('.container');
// 切换容器内所有内容的显示状态
$container.find('.content').slideToggle('fast');
// 如果需要,可以添加额外的逻辑来处理展开和收缩的状态
// 例如,切换图标或添加/移除特定的类
$(this).toggleClass('active');