tinyMCE和insertAtCaret（），替代tinyMCE？

我有一個帶有insertAtCaret（）函數的文本區域，該函數允許用戶從列表拖放到文本區域，這一切都很好，很棒。我的老闆讓我把tinyMCE放在上面，這樣用戶就看不到html格式了。當我這樣做時，我的拖放功能就打破了。tinyMCE和insertAtCaret（），替代tinyMCE？

據我所知，tinyMCE有一個允許拖放的內置函數，但它不是我們想要的系統形式。所以，如果有的話，我還需要禁用該功能（該筆記上的任何線索？）

我的問題是，是否有替代tinyMCE，將與insertAtCaret很好？我一直在谷歌搜索，但沒有發現任何真正有用的東西。只有來自其他人的幾個帖子有相同的問題。

在此先感謝 -V

來源

2011-11-11 littleghost76

你是什麼意思「不是我們想要的系統」？ – simshaun

我們不希望用戶拖放任何鏈接或任何東西。拖放列表非常具體，它是純文本。 – littleghost76

我對TinyMCE的功能和可配置性感到不滿，所以我選擇了CKEditor。您可能無法使用_insertAtCaret_，但有模擬功能可以做到這一點，如果您對處理不滿意，則可以輕鬆編寫插件。 – Smamatti

我也遇到了這個問題。問題是，大多數這些編輯器使用iframe來顯示html，只是隱藏輸入字段。因此，您需要查找並綁定可拖放的可拖拽到iframe並觸發事件來檢測並處理該事件。

我做了一些與CKEditor類似的工作，但不是拖動，而是做一些onclick事件，將一些html放在插入符號處。下面的示例：

<ul class="dis-tags"> 
    <li title="Id of the soo. This is useful for links and reference.">[SooID]</li> 
    <li title="The user first name.">[FirstName]</li> 
    <li title="The user last name.">[LastName]</li> 
</ul> 

// used to set the drag/drop of the tags 
$('.dis-tags li').click(function() { 
    CKEDITOR.instances.Message.insertHtml($(this).text()); 
    return false 
});

來源

2011-11-11 21:57:52 uadrive

其他什麼uadrive回答：

insertAtCaret不會與任何實時編輯器打造成它們都使用CONTENTEDITABLE iframe中。底層teaxtarea（或其他HTML元素）在初始化時隱藏。

uadrive是正確的，您將不得不添加處理程序到該iframe，以便在需要時執行任何操作。如果您使用tinymce配置參數「paste_block_drop」，則您將無法執行任何拖動操作，因爲如果將此參數設置爲true，則所有拖放事件都將被阻止。

要在TinyMCE的插入位置插入代碼中有使用命令：

tinyMCE.execCommand('mceInsertContent', false, 'my new content to be added');

下面是一些代碼一起玩（這是一個動作我在編輯器中滴做我重建插入內容，然後根據我的需要添加/過濾它，並將其插回到編輯器中）。

setup : function(ed) 
{ 
    ed.onInit.add(function(ed){ 
    $(ed.getDoc()).bind('drop', function(event){ 

     ed.content_pre = ed.getContent(); 
     ed.drag_content_html = event.originalEvent.dataTransfer.getData('text/html'); 
     ed.drag_content_plain1 = event.originalEvent.dataTransfer.getData('text/plain'); 
     //console.log('x', ed.content_pre, ed); 
     tinymce.activeEditor = ed; 
     setTimeout(function(){ 
      var ed = tinymce.activeEditor; 
      var content_post = ed.getContent(); 
      var diff_front = 0; 
      for (var i=0; i < ed.content_pre.length; i++) { 
       if (ed.content_pre.charCodeAt(i) !== content_post.charCodeAt(i)) { 
        diff_front = i; 
        break; 
       } 
      }    

      if (ed.content_pre.substr(diff_front-2, 2) == '<p') diff_front -= 2; 
      if (ed.content_pre.substr(diff_front-1, 1) == '<') diff_front -= 1; 

      ed.setContent(ed.content_pre.substr(0, diff_front) + ed.drag_content_plain1 + ed.content_pre.substr(diff_front)); 

     },0); 
    }); 
    }); 
},

來源

2011-11-14 09:09:32 Thariama

tinyMCE和insertAtCaret（），替代tinyMCE？

回答

相關問題