jQuery实现点击仅展示对应父级下post-reply-box、隐藏同类div问询

你现有的代码直接使用全局类选择器.post-reply-box获取元素，会匹配页面内所有同类回复框，所以操作时会统一触发所有元素的显隐逻辑。

$(document).ready(function(){
    // 回复按钮点击逻辑
    $(".fa-reply").on("click",function(){
        // 先隐藏所有回复框（可选，不需要排他关闭其他回复框可删掉这行）
        $(".post-reply-box").hide();
        // 仅定位当前点击按钮对应的回复框
        $(this)
          .closest(".we-comment") // 向上查找当前评论的外层容器
          .next(".comnt-reply") // 查找相邻的回复区容器
          .find(".post-reply-box") // 匹配到对应回复框
          .show(); // 仅显示当前这一个回复框
    });

    // 取消按钮点击逻辑
    $(".cancelButton").on("click",function(e){
        e.preventDefault(); // 阻止按钮默认的表单提交行为
        // 仅隐藏当前点击按钮所属的回复框
        $(this).closest(".post-reply-box").hide();
    });
});

如果你的实际HTML结构和给出的示例存在层级差异，只需要调整closest()、next()的匹配类名，保证能定位到对应回复框即可。

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