Question

您好我得到了类似的代码

<form method="post" action="/" name="form" autocomplete="off">
<input type="text" name="title" />
<textarea name="body"></textarea>
<input type="text" name="tags" />
<input type="submit" name="submit" value="Send" />
</form>

当“textarea”是tinyMCE时...当我尝试通过输入和textarea项目移动选择时出现问题。当页面加载时，焦点输入[name = text]但是当我按Tab键时它选择输入[name = tags]而不是textarea [name = body]（下一个）你可以帮我解决这个问题吗？

Answer 1

传统的标签索引是不可能的，因为TinyMCE实际隐藏<textarea>并使用其中的编辑器创建<iframe>。你可以通过在javascript中的前一个元素的blur事件中强制关注编辑器来解决这个问题，这里是ajQuery剪掉了我的头脑：

$('#prev-input').blur(function(){
    tinyMCE.get('textarea').focus();
});

然后，一旦用户离开前一个输入焦点，就会跳转到TinyMCE编辑器，你也可以添加一个blur（）方法来获得下一个元素。

Answer 2

我通过向插件添加'tabfocus'然后添加tabfocus_elements来解决这个问题：“：prev，：next”

http://tinymce.moxiecode.com/wiki.php/Plugin:tabfocus

http://tinymce.moxiecode.com/wiki.php/tabfocus_elements

Answer 3

有一个插件解决了它

http://sourceforge.net/tracker/index.php?func=detail&aid=1657397&group_id=103281&atid=738747

我从TinyMCE论坛了解到它

http://tinymce.moxiecode.com/forum/viewtopic.php?id=813

Answer 4

我需要从页面上的其他元素开始的自定义标签顺序。我在IE11中用来解决这个问题的代码是

var button = $('#btn-id');
button.on('keydown', function (e) {
    if ((e.which === 9 && !e.shiftKey)) {
        e.preventDefault();
        $(tinyMCE.get()[0].contentWindow).focus();
    }
});

请注意，只有在页面上只有一个编辑器时，上述代码才有效。否则，你必须遍历tinyMCE.get()返回的数组才能找到正确的编辑器来设置焦点。

Answer 5

我发现focus事件已被触发，但始终无法集中于元素（容器）上。

在我的情况下，我从编辑器1-4中切换了选项卡，而当我按住shift + tab时，我不再关注实例。

为解决此问题，我在tinyMCE的设置事件中添加了以下内容

setup: function(editor) {
  editor.on("focus", function(e) {
    e.target.editorContainer.scrollIntoView();
  });
}

按Tab键时如何选择tinyMCE textarea？

5 个答案: