javascript - aria-expanded ="true"不会将类添加到父级

标签 javascript jquery

当折叠链接具有 aria-expanded="true"时,我尝试向我的父 div 添加一个类,但没有任何反应。

<div class="info-tab col-xl-3">
          <div class="info-img">
            <?php the_post_thumbnail(); ?>
          </div><!-- .news_img -->
          <a data-toggle="collapse" href="#collapse-<?php the_ID(); ?>" class="info-title" role="button" aria-expanded="false" aria-controls="collapse-<?php the_ID(); ?>">
            <?php the_title(); ?>
          </a>
        </div>

和jquery

  jQuery(function($){
$(function() {
  $('.info-title[aria-expanded="true"]').closest('.info-tab').addClass('no-border');
});
});

我还试图通过将 .info-title[aria-expanded="true"] 更改为 a[aria-expanded="true"] 并最接近 parent 来使其工作,但它不起作用。

最佳答案

由于它是一个引导折叠目标,默认情况下具有 aria-expanded="false"并在单击它后将值更改为 true,因此我需要将 js 代码更改为:

jQuery(function($){
 $( ".info-title" ).click(function() {
  $( this ).closest('.info-tab').toggleClass('no-border');
 }); 
});

希望这对将来的人有帮助

关于javascript - aria-expanded ="true"不会将类添加到父级,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50263718/

相关文章:

php - 如果单击浏览器按钮,如何在服务器端显示消息

javascript - 单行内联注释前空格的 ESLint 规则

javascript - Jquery ControlGroup 文本输入

javascript - 弹出的 prettyPhoto 最大宽度和高度太大

javascript - 如何使用谷歌图表在同一个图表上绘制多个数据点

javascript - 使用jquery动态获取property_id

javascript - 粘性标题过渡不平滑

jqueryMobile 水龙头和冒泡/传播

javascript - 使用 JavaScript 或 jQuery 获取具有相同类的所有 DOM 节点的总和

javascript - IE 和 Firefox 之间空 XML 响应的不同行为