时间戳

首页 > 解决方案 > 如何使用 jQuery 切换一个元素而不使用其他元素？

javascript - 如何使用 jQuery 切换一个元素而不使用其他元素？

问题描述

我想知道如何在不切换其他元素的情况下切换一个元素......我只是不想每次都这样做：

HTML：

<div class="share-toggle as-1"></div>

<div class="audio-share as1">
  <p>Some Text</p>
</div>

<div class="share-toggle as-2"></div>

<div class="audio-share as2">
  <p>Some Text</p>
</div>

JS：

$('.as-1').click(function() {
  $('.as1').slideToggle('fast');
});

$('.as-2').click(function() {
  $('.as2').slideToggle('fast');
});

有没有办法简单地写这个？请帮助...谢谢

标签： javascriptjqueryhtmlonclick

解决方案

您可以使用 jQuery 选择所有className包含某个子字符串的元素：

$('*[class*="as-"]')

这将选择 DOM ( *) 中的所有元素，其中className( [class=""]) 包含"as-"任何位置 ( *)。

然后你可以使用传递的元素this来获取元素的编号"as-"并切换想要的元素：

$('*[class*="as-"]').click(function () {
  let elemNum = this.className.match(/as-(\d+)/)[1];
  $("as"+elemNum).slideToggle('fast');
});

推荐阅读