jquery 设置焦点加载TinyMce编辑器

ejk8hzay 于 2023-10-17 发布在 jQuery

关注(0)|答案(4)|浏览(195)

当点击编辑按钮时，它会显示tinymce文本编辑器，但问题是它不会将焦点设置在第一次加载的编辑器上，从第二次开始，它工作正常
下面是我尝试过的。
HTML

<h3>History Review <a href="#" class="blue_edit_btn" id="history_review_link" onclick="bgshoweditor('history_review')" >Edit</a></h3>

jQuery

function bgshoweditor(editorid)
{

    $("#"+editorid+"_div").hide();
    $("#"+editorid).show(); 
    tinyMCE.execCommand('mceRemoveControl', false, editorid );
    tinyMCE.execCommand('mceAddControl', true, editorid );
    tinyMCE.execCommand('mceFocus', false, editorid );      
    tinyMCE.activeEditor.selection.select(tinyMCE.activeEditor.getBody(), true);
    tinyMCE.activeEditor.selection.collapse(false); 
}

jquery

来源：https://stackoverflow.com/questions/23823334/set-focus-onload-of-tinymce-editor

4条答案

按热度按时间

62lalag41#

也许mceFocus命令在TinyMce 4中被删除了（我这么说是因为在4.x中删除了mceRemoveControl和mceAddControl）。
所以，我建议使用.focus()
试试这个：

tinyMCE.get(editorid).focus();

Working Example
或者你可以使用auto_focus属性。
auto_focus：这个选项允许你自动聚焦编辑器示例。

注意：auto_focus在加载编辑器时设置焦点

赞(0）回复(0）举报 2023-10-17

lyfkaqu12#

试试这个代码可能对你有用

function bgshoweditor(editorid)
{

$("#"+editorid+"_div").hide();
$("#"+editorid).show(); 
 if (tinyMCE.activeEditor == null || tinyMCE.activeEditor.isHidden() != false) {
     tinyMCE.execCommand('mceRemoveControl', false, editorid );
 }
tinyMCE.execCommand('mceAddControl', true, editorid );
tinyMCE.execCommand('mceFocus', false, editorid );      
tinyMCE.activeEditor.selection.select(tinyMCE.activeEditor.getBody(), true);
tinyMCE.activeEditor.selection.collapse(false); 
}

赞(0）回复(0）举报 2023-10-17

5hcedyr03#

对于tinyMCE v4+

tinymce.activeEditor.focus();

赞(0）回复(0）举报 2023-10-17

0lvr5msh4#

如果您正在寻找VUE瘦插件@tinymce/tinymce-vue的解决方案，

import { getTinymce } from '@tinymce/tinymce-vue/lib/es2015/main/ts/TinyMCE'

const tinyMCE = getTinymce()
tinyMCE.activeEditor.focus()

赞(0）回复(0）举报 2023-10-17

我来回答

jquery 设置焦点加载TinyMce编辑器

4条答案

相关问题

热门标签

最新问答