Trix WYSIWYG 选项卡索引未按预期工作

Question

我在一个表单上有多个 trix 输入。通常在表单中，当您在表单输入中按 Tab 键时：它会将您跳转到下一个表单输入。我注意到在台式计算机上：为 trix 输入选项卡实际上是在最终进入下一个输入之前通过所有 trix 工具栏按钮来标记您。有趣的是：它可以与 iPad 和蓝牙键盘配合使用。

在 trix 的 github 上指出了这个问题：located here。该问题已关闭，因为那里发布了明显解决问题的解决方法。以下是其中一项建议：

for (var element of event.target.toolbarElement.querySelectorAll("button")) {
  element.tabIndex = -1
}

但是，当我将它插入我的应用程序并查看前端错误日志时，它是这样说的：

TypeError：event.target.toolbarElement.querySelectorAll 的元素不是函数。 （在'event.target.toolbarElement.querySelectorAll("button")'的元素中，'event.target.toolbarElement.querySelectorAll'的元素是未定义的）

我相信该解决方案有效，但我可能遗漏了一些东西。我对javascript不是很熟悉，所以错误信息对我来说有点神秘。

• trix documentation
• 我认为这不适用于这里：但我在 Rails 项目中使用它，我通过 trix gem 引入了 trix。

Answer 1

只需要更改语法，它就起作用了：

document.addEventListener("trix-initialize", function(event) {
  var elementButtons = event.target.toolbarElement.querySelectorAll("button")

  for (i=0; i<elementButtons.length; i++) {
    elementButtons[i].tabIndex = -1 ;
  }
})