如何在jQuery中实现点击一级标题展开对应二级标题的折叠卡片效果？

在jQuery中，实现这种点击一级标题展开二级标题的折叠卡片效果相当简单。首先，你需要在HTML中为一级标题和二级标题设置相应的类名，并确保二级标题默认处于隐藏状态。例如：

<ul id="accordion">
  <li>
    <a href="#section1">一级标题1</a>
    <div id="section1" style="display: none;">二级标题1内容</div>
  </li>
  <!-- 其他一级标题项... -->
</ul>

接下来，使用jQuery绑定每个一级标题的点击事件：

$(document).ready(function(){
  $('#accordion a').click(function(e){
    e.preventDefault(); // 阻止链接的默认跳转行为
    
    // 获取当前激活的链接和对应的二级标题
    var $activeLi = $(this).parent();
    var $target = $('#' + $(this).attr('href'));

    // 收起所有已打开的二级标题
    $('#accordion .content').slideUp('fast');

    // 展开或折叠当前点击的二级标题
    if (!$activeLi.next().is(':visible')) { // 如果未展开
      $target.slideDown('fast'); // 展开
    } else { // 如果已经展开
      $target.slideUp('fast'); // 折叠
    }

    // 保存活动状态，只有当前一级标题保持激活
    $activeLi.toggleClass('active');
  });
});

在这个例子中，我们使用了`.slideUp()`和`.slideDown()`方法来切换二级标题的可见性，`preventDefault()`是为了阻止链接直接导航到新页面。当一级标题被点击时，除了当前选中的之外，其他已展开的都会关闭。

为了效果美观，还可以给HTML添加适当的CSS，比如设置`.active`类来改变一级标题的样式。