javascript - 使用 onclick 切换特定的类元素

标签 javascript html

目前我有大约 10 个这样的“容器”的无序列表。 每个容器都有一个描述和一个“帮助更多内容”按钮。

    <div id="item" class="container">

          <div class="item">UniqueIdentifierInt</div>

          <a href="someLinkUrl">linkName</a>

          <div class="trackUri">someLinkUrlString</div>

          <div class="description" style="display: none;">DescriptionString</div>

          <a class="mt-help-more-content" href="#"></a>

   </div>

该功能应该是当您点击此容器的“帮助更多内容”按钮时,它将显示该容器的描述。

但是,当单击按钮时,它会在屏幕上显示所有容器的描述。

这是当前的点击

.on("click", ".mt-help-more-content", function(e) {
     $('.description').toggle(); 
}

现在显然这个切换函数正在所有“描述”元素上被调用。如何指定它只作用于当前容器?

我查看了其他答案 here , here ,和here但没有任何实际作用。

是否可以只切换特定类别?貌似不能通过id切换。

我是 javascript/html 新手,因为我的背景是 Java,所以如果这很简单,我深表歉意。

非常感谢任何帮助,谢谢。

最佳答案

$.prev就可以了:

.on("click", ".mt-help-more-content", function(e) {
     $(this).prev('.description').toggle(); 
}

关于javascript - 使用 onclick 切换特定的类元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39260463/

相关文章:

javascript - 是什么导致 jQuery 对象不同?

javascript - 获取 Google map 标记之间的距离(以像素为单位)或 "visual distance"

javascript - Monkeytalk JS 获取表的长度

javascript - 数据表 : disable first next previous last and show/search record when processing

javascript - jQuery .accordion() 不起作用,因为 jQuery 未加载到 HTML 中

javascript - 提交时的 Google 表单获取值并设置时间格式

javascript - .fadeToggle 更改我的 div 的位置

php - 带有自定义媒体查询的 Bootstrap 移动菜单

html - 不考虑绝对定位元素的宽度

javascript - 如果我将输入值存储在变量中,为什么它的值始终为空?