javascript - addClass() 不起作用

Question

我有一个 Bootstrap 按钮

<button onclick="leaveOpen()">TEST</button>

它调用自定义函数

function leaveOpen(){
  $("#rangeDropdown").addClass('open');
  $("#dropdownMenu2").trigger('focus').attr('aria-expanded', 'true');
}(jQuery);

这会影响这些元素

<div class="dropup mobilewidth mobilebottom" id="rangeDropdown">
  <button class="btn btn-default dropdown-toggle mobilewidth" type="button" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
   ...
  </button>
...
</div>

这部分有效

$("#dropdownMenu2").trigger('focus').attr('aria-expanded', 'true');

但这部分没有

$("#rangeDropdown").addClass('open');

当我点击TEST按钮时，“dropup mobilewidth mobilebottom”在chrome开发者工具中亮起，就像发生了变化一样，但是'open ' 类未添加。我做错了什么？

Answer 1

这显然是添加和删除类的问题。

可能 Bootstrap 监视 focus 事件并切换 open 类。如果您的处理程序在 Bootstrap 之前:

• 您:打开已添加

• Bootstrap :打开已切换

-> 结果:没有任何变化

在另一种情况下，将添加该类，但查看您的描述，Chrome 开发工具闪烁显示某些内容发生了变化，这实际上是双重更改 open 类的问题