Question

我正在尝试使用小型自定义工具创建基本编辑器。

当文档准备就绪时，我创建一个带有contenteditable =“true”attr的div并将其附加到textarea下面，然后隐藏textarea。它正在被创造出来。

当我点击该div时，它没有得到焦点，我无法在那里输入任何内容。但是当我尝试使用inspect element工具为该div添加一些样式时。然后我再点击那个div然后它就可以了。

这是我的代码

  $(document).ready(function(){
    if($(".text-format-wrapper").length > 0){
      _editor_init();
    }
  });
  function _editor_init(){
    $(".text-format-wrapper").each(function(){
      var filterType = $(this).find(".filter-list").val();
      var filterEnable = false;
      for(var i in Drupal.settings.editor_filter){
        if(Drupal.settings.editor_filter[i] == filterType){
          filterEnable = true;
        }
      }
      var textareaObj = $(this).find('textarea')
      if(filterEnable){
        addEditor(textareaObj);
      }else{
        removeEditor(textareaObj);
      }
    });
  }
  function addEditor(textareaObj){
    if(textareaObj.closest(".form-textarea-wrapper").find(".editor").length == 0){
      var content = textareaObj.val();
      var d = document.createElement("div");
      d.className = 'editor';
      d.id = 'editor';
      d.contentEditable = "true";
      d.innerText = content;
      $('.form-textarea-wrapper').prepend(d);
      textareaObj.hide();
    }

我正在Drupal模块中准备这个。请帮忙。

谢谢

contenteditable div不可编辑

0 个答案: