触发选项卡索引切换时是否会触发 JavaScript 事件?(TABINDEX 不适用于 IFRAME 中的输入)

tre*_*ace 5 javascript jquery events jquery-events

我的具体用例是我有一个所见即所得编辑器,它基本上是一个可编辑的 iframe。然而,对于用户来说,它看起来像一个标准的文本区域。我的问题是,我在(感知的)选项卡索引中的该编辑器之前和之后有输入,我希望用户能够按选项卡(或他选择的平台上的等效键)进入所见即所得编辑器当他位于前一个元素时,使用 Shift-Tab 可以在后一个元素中访问该元素。

我知道这可以使用按键事件并检查是否按下 Tab 键来伪造,但我很好奇是否有更好的方法。


更新。Treeface在评论中澄清了实际问题。

问题

在正常情况下,您可以使用元素TABINDEX的“ ”属性<input>来控制,当跳出“主题”输入字段(以电子邮件形式)时,焦点落在电子邮件中的“正文”输入字段上。只需将正确排序的值分配给两个输入字段的“TABINDEX”属性即可完成此操作。

问题是 TABINDEX 属性仅对同一框架内的元素进行排序。因此,如果“正文”输入字段实际上位于内部IFRAME,则无法使用 TABINDEX 顺序从父框架中的“主题”直接跳到 IFRAME 中的“正文”。

DVK*_*DVK 4

您可以通过相关输入元素的 onfocus/onblur 事件来模拟所需的行为(可能比检测 TAB 键问题更少)。这样你就不用关心用户如何进入编辑器输入,无论是通过选项卡还是单击或一些奇怪的 FireFox AddOn,它允许你通过 ID/名称/# 跳转到输入元素(我几乎某些此类附加组件存在:)


更新。OP在评论中澄清了这个问题。

问题

在正常情况下,您可以使用元素TABINDEX的“ ”属性<input>来控制,当跳出“主题”输入字段(以电子邮件形式)时,焦点落在电子邮件中的“正文”输入字段上。只需将正确排序的值分配给两个输入字段的“TABINDEX”属性即可完成此操作。

问题是 TABINDEX 属性仅对同一框架内的元素进行排序。因此,如果“正文”输入字段实际上位于内部IFRAME,则无法使用 TABINDEX 顺序从父框架中的“主题”直接跳到 IFRAME 中的“正文”。

解决方案

在父框架中,创建一个新<INPUT>元素。它将是不可见的(例如通过 CSS 或使大小为 1x1),将具有“Body_clone”的名称/ID,并且将具有跟随“Subject”字段的 TABINDEX 的 TABINDEX 属性值。它还将有一个 onFocus 处理程序,该处理程序将简单地在 IFRAME 内查找“Body”输入元素并调用focus()该元素。

您可以通过在 IFRAME 中创建“Subject_iframe_clone”和“After-body_iframe_clone”输入元素,对 IFRAME“Body”元素中的 Tab 键/Shift-Tab 键执行相同的操作,其工作方式与“Body_clone”一样。