下拉列表中的可访问Bootstrap手风琴

Question

我已经按照Bootstrap推荐的标记实现了一些手风琴，但它并不完全符合ARIA。我正在考虑这样的事情：

http://oaa-accessibility.org/examplep/accordian1/

但是，当我按Tab键和箭头，空格并输入键盘键时，行为不是预期的。 Bootstrap不会处理关键事件，并且某些aria属性缺失和/或未正确更新（即aria-selected，tabindex）

我尝试在可访问的示例中集成JavaScript代码，但我认为它并不像我想的那么顺利。

我有这个codepen http://codepen.io/anon/pen/jWWewr

<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
  <div class="panel panel-default"> ... here goes the panel-heading
  </div>
  <div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne"> ... here goes the panel contents
  </div>
</div>

几个问题：

1. 第一次尝试在第二个和最后一个面板中显示（按空格键或输入键）时，请勿在第一次尝试时打开。也许只是一个加价问题？或者我在代码中有任何人可以帮助我发现的错误......
2. 是否可以在没有这个特殊脚本的情况下在Bootstrap中使用它，只需指定符合aria标记？
3. 如果答案是否定的，那么将其转换为Bootstrap插件的最佳方法是什么？任何人都可以指出我正在编写Bootstrap插件的正确途径吗？

提前致谢！