Javascript 如何在运行时创建多个切换？

我创建了一个页面，使用ajax显示带有注释的帖子 要查看评论，用户必须单击与帖子对应的评论按钮 为了便于理解，例如：

在HTML中 挡块

cmt1
cmt2
评论
评论

"

我尝试使用for循环作为

for(var i=0;i<count;i++){
    $("#cmt"+i).hide();
    $("#cmtbtn"+i).click(function(){
       $("#cmt"+i).toggle('slow');
    });
}

---

for（var i=0；i从给出按钮和divs类开始

<button id="btn1" class="actionButtons">cmt1</button>
<button id="btn2" class="actionButtons">cmt2</button>
<div id="cmt1" class="actionDivs" style="display:none">comments1<br/>more comments<br/>and even more</div>
<div id="cmt2" class="actionDivs" style="display:none">comments2<br/>another comment<br/>and another one</div>

cmt1
cmt2
评论1
更多评论
甚至更多
评论2
另一条评论和另一条评论

然后循环使用该类名的元素

for(var  i = 0; i < $(".actionButtons").length; i++){
    $(".actionButtons")[i].onclick = function () {
        for(var j = 0; j < $(".actionDivs").length; j++){
            if ($(".actionDivs")[j].id == this.innerText)
                $("#" + this.innerText).show();
            else
                $("#" + $(".actionDivs")[j].id).hide();
        }
    };
}

for（var i=0；i<$（“.actionButtons”）.length；i++）{
$（“.actionButtons”）[i].onclick=function（）{
对于（var j=0；j<$（“.actionDivs”）.length；j++）{
if（$（“.actionDivs”）[j].id==this.innerText）
$（“#”+this.innerText.show（）；
其他的
$（“#”+$（“.actionDivs”）[j].id.hide（）；
}
};
}



我希望这能让您更接近您的解决方案。
这是您想要的吗？一种获取按钮索引的方法，它相当于文档中隐藏注释的索引位置

您只需隐藏上一条注释并显示新注释

var oldNode = '';
function showComment = function(index) {

    if (typeof oldNode != undefined) $(oldNode).hide('slow');
    $('.comment:eq('+$(index).index()+')').show();
    oldNode = $('comment:eq('+$(index).index()+')');
}



<button onclick="showComment(this)">cmnt 1</button>
<button onclick="showComment(this)" >cmnt 2</button>

<div class='comment' style='display: none'>comment a</div>
<div class='comment' style='display: none'>comment b</div>

var oldNode=''；
函数showComment=函数（索引）{
if（typeof oldNode！=未定义）$（oldNode）.hide（'slow'）；
$（'.comment:eq（'+$（index.index（）+'））.show（）；
oldNode=$（'comment:eq（'+$（index.index（）+'））；
}
cmnt 1
cmnt 2
评论a
意见b
尝试为所有“注释按钮”以及“注释Div”赋予相同且唯一的类。如下面的示例：

<button id="btn1" class="comtbtn"> cmt1 </button>
<button id="btn2" class="comtbtn"> cmt2 </button>
<div id="cmt1" class="comt-div">comments1</div>
<div id="cmt2" class="comt-div">comments2</div>

cmt1
cmt2
评论1
评论2

然后捕捉类“comtbtn”上的点击事件。下面是隐藏注释显示的js脚本-

$('.comtbtn').click(function() {
       var btnId = $(this).attr("id");
       var id = btnId.slice(-1);
       $( "#cmt"+id ).toggle( "slow" );
    });
$（'.comtbtn'）。单击（函数（）{
var btnId=$（this.attr（“id”）；
var id=btnId.slice（-1）；
$（“#cmt”+id）.toggle（“slow”）；
});
添加css以在最初加载到DOM时隐藏所有注释部分

.comt-div{
      display:none;
    }
司令官分区{
显示：无；
}
我得到的答案是，可以使用遍历来切换内部循环。谢谢大家，我终于找到了答案。
请发布您迄今为止所做的代码。忘记显示代码了，您可以制作JSFIDEL吗？@amy您的答案更多的是静态内容。我知道如何实现它，但当更多的注释和更多的注释按钮出现时ajax在运行时对如何分配jquerySorry进行了修改我错过了ajax部分我想说的是有没有for循环或任何循环的方法我想你必须重新构建你的整个问题
.comt-div{
      display:none;
    }