jQuery多面板切换时同步切换文本功能优化求助

我懂你的需求啦——现在点击单个面板能切换自身文本，但切换到其他面板时，原来打开的面板文本没跟着切回去是吧？咱们来调整下代码搞定这个问题：

核心问题在于，你之前的代码只处理了当前点击面板的文本切换，却没把之前处于“展开”状态的面板文本重置回默认值。下面是修改后的完整代码：

$(".subpaneltext").click(function() { 
  // 先获取当前点击面板对应的父容器和目标元素
  const currentMainPanel = $(this).closest('.mainpanel');
  const currentMoreQuestions = currentMainPanel.find('.morequestions');
  const isCurrentExpanded = currentMoreQuestions.hasClass("togglequestions");

  // 第一步：全局重置所有面板的状态和文本
  $('.morequestions').removeClass("togglequestions");
  $('.subpaneltext').text("See more questions...");

  // 第二步：根据当前面板之前的状态，决定是否展开它并修改文本
  if (!isCurrentExpanded) {
    currentMoreQuestions.addClass("togglequestions");
    $(this).text("See less questions...");
  }
});

逻辑拆解： #

• 全局重置：不管点击的是哪个面板，先把所有面板的展开状态取消，同时把所有切换文本改回默认的“See more questions...”，确保之前打开的面板都回到初始状态。
• 单独处理当前面板：判断当前面板之前是否是收起状态，如果是，就给它加上展开类，并把文本改成“See less questions...”；如果之前是展开状态，重置后就保持收起，不用额外操作。

这样修改后，不管你切换到哪个面板，其他面板都会同步收起并恢复默认文本，当前面板的状态和文本也能正确切换啦。

内容的提问来源于stack exchange，提问作者rukasu