Question

使用jquery.collapsible.js我注意到扩展/关闭时tabindex不会改变。我几乎有一个解决方案，但如果有人可以改进这段代码，我会很感激，因为我相信有更好的方法可以做到这一点。

$('.collapsible').each(function() {
 $('.collapsible').on('click',function(e) {
 if($('div').hasClass('collapsible collapse-open')) {
$('.collapsible.collapse-open').attr("tabIndex", 0);
 } else {
$('.collapsible.collapse-close').attr("tabIndex", -1);
}

});

});

问题是tabindex仅在第二次点击时发生变化，然后0，-1顺序错误。

Answer 1

如果您只是寻找更好的方法，并且您的解决方案已经有效，那么您可以使用它来简化它。您无需使用.collapsible函数遍历每个each，只需添加click事件处理程序。

$(".collapsible").on('click', function (e) {
    var self = $(this);
    var tabIndex = self.hasClass("collapse-open") ? 0 : -1;
    self.attr("tabIndex", tabIndex); 
});

这将选择具有类collapsible的任何元素，绑定click事件，然后检查该元素是否具有collapse-open类以确定要应用哪个选项卡索引。

Answer 2

感谢Ihan提供更高效的脚本。它现在正在工作我只需要更改＆＃39; collapse-open＆＃39;关闭＆＃39;崩溃 - 关闭＆＃39;。

$(".collapsible").on('click', function (e) {
    var self = $(this);
    var tabIndex = self.hasClass("collapse-close") ? 0 : -1;
    self.attr("tabIndex", tabIndex); 
});

jQuery可折叠tabindex

2 个答案: