使用 Jquery 将类切换更改为多个跨度元素答案

【问题标题】：Change class toggle to multiple span element with Jquery使用 Jquery 将类切换更改为多个跨度元素
【发布时间】：2021-01-13 00:48:27
【问题描述】：

当我单击浏览器行之一时，我需要更改使用切换的跨度子项的类。但它只在有单行时有效，当有几行时它找不到跨度并且不起作用。

我也试过用href来选择正确的span，但是不知道在JQuery代码中怎么用

<div>
<a id="menu-toggle" data-toggle="collapse" data-parent="#accordion" href="#01" class='btn btn-default' title='Ver pagos'>
<span class="glyphicon glyphicon-chevron-down"></span>
</a>
</div>
<div>
<a id="menu-toggle" data-toggle="collapse" data-parent="#accordion" href="#02" class='btn btn-default' title='Ver pagos'>
<span class="glyphicon glyphicon-chevron-down"></span>
</a>
</div>

jQuery(function($) {
  $('#menu-toggle').on('click', function() {
    var $el = $(this),
    textNode = this.lastChild;   
    var $href = $(this).attr('href');
    var $href = $href.substring(1);
    $el.find('span').toggleClass('glyphicon-chevron-down glyphicon-chevron-up');
  });
});```

【问题讨论】：

id;s 对于每个元素必须是唯一的。你有重复的id's - 使用类来处理点击menu-toggles
$('#menu-toggle').each(function(index) { // 使用 $(this)});

标签： php html jquery bootstrap-4

【解决方案1】：

试试这个

var el = 2
for(var i=0; i<el.length; i++) {  
  document.getElementsByClassName("glyphicon").find('span').toggleClass('glyphicon- 
  chevron-down glyphicon-chevron-up');
}

【讨论】：

【解决方案2】：

最后我简化了代码，所以我注释了 span，然后使用函数 onclick CambiaClass 调用，使用类 data1、data 2 ... dataN（识别项目），现在工作正常。

感谢您的帮助拉胡尔！！！

<a id="menu-toggle" data-toggle="collapse" data-parent="#accordion" href="#<?php echo $id_item; ?>" 
class='btn btn-default glyphicon glyphicon-chevron-down <?php echo 'dato'.$id_item; ?>' 
title='Ver pagos' onclick="CambiaClass('<?php echo 'dato'.$id_item; ?>')">
    <!-- span class="glyphicon glyphicon-chevron-down"></span --> 
</a>

//Jquery
<script type="text/javascript">
    function CambiaClass(idclass) {
      $("[class*='"+ idclass+"']").toggleClass('glyphicon glyphicon-chevron-down').toggleClass('glyphicon glyphicon-chevron-up');
    }
</script>

【讨论】：