Froala编辑器:将光标聚焦在页面加载上



我认为这样的事情很简单,但显然不是。 我正在使用Froala编辑器的付费版本,我喜欢它。 但是,当页面在编辑器中加载时,它需要聚焦光标,这样我就不必强迫我的用户手动单击它。

这是他们官方文档中的代码,但似乎不起作用。

# HTML
<textarea id="task_body" autofocus="true">...</textarea>
# JavaScript
editor = $("#task_body").froalaEditor({});
editor.froalaEditor("events.focus");

我想做的只是在页面加载时将光标集中在 Froala 编辑器字段中;我什至会对在页面加载后调用焦点事件的 JS 解决方案感到满意。

要在 Froala init() 上设置焦点,请执行以下操作:

$('div#froala-editor')
 .on('froalaEditor.initialized', function (e, editor) {
  editor.events.focus(true);
}).froalaEditor({
  ......editor init settings...
})

这使用 jquery 事件机制来捕获 froalaEditor.initialized 事件,然后用户传入的编辑器对象来调用焦点。

要以编程方式分配焦点,这意味着在 Froala init() 之后的任何时间,请使用

$('selector').froalaEditor('events.focus', true).

例如,这里我使用延迟来模拟 Froala init() 和焦点调用之间的时间流逝:

  setTimeout(function(){
    $('#edit').froalaEditor('events.focus', true);
      console.clear()
      console.log('fired focus trigger!')
  }, 2000)

虽然知道这一点很有用,但当前 Froala API 文档的要点并没有提供这种见解,而是暗示语法是

$('#selector').froalaEditor('events.trigger', 'focus');

我无法上班。也许Froala应该考虑澄清文档。

感谢Froala支持的Stefan,他迅速响应了我的求助电话。

最新更新