2012-06-14 11 views
5

Ich versuche, einen benutzerdefinierten WYSIWYG-Editor mit einem contenteditable<div> zu implementieren.forced_root_block Option in TinyMCE

Eines der wichtigsten Probleme, mit denen ich konfrontiert bin, ist die inkonsistente Art und Weise Browser ENTER Tastenanschlag (Zeilenumbrüche). Chrome fügt <div> ein, Firefox fügt <br> ein und IE fügt <p> ein. Ich habe mir TinyMCE angesehen und es hat eine Konfigurationsoption namens forced_root_block. Einstellung forced_root_block bis div funktioniert tatsächlich über alle gängigen Browser. Weiß jemand, wie forced_root_block Option in TinyMCE in der Lage ist, es über Browser zu erreichen?

+0

+1 gute Frage – Thariama

Antwort

2

In der tinymce Quelle (/tiny_mce/classs/dom/DomParser.js) finden Sie die folgenden finden:

rootBlockName = "forced_root_block" in args ? args.forced_root_block : settings.forced_root_block; 

     whiteSpaceElements = schema.getWhiteSpaceElements(); 
     startWhiteSpaceRegExp = /^[ \t\r\n]+/; 
     endWhiteSpaceRegExp = /[ \t\r\n]+$/; 
     allWhiteSpaceRegExp = /[ \t\r\n]+/g; 

     function addRootBlocks() { 
      var node = rootNode.firstChild, next, rootBlockNode; 

      while (node) { 
       next = node.next; 

       if (node.type == 3 || (node.type == 1 && node.name !== 'p' && !blockElements[node.name] && !node.attr('data-mce-type'))) { 
        if (!rootBlockNode) { 
         // Create a new root block element 
         rootBlockNode = createNode(rootBlockName, 1); 
         rootNode.insert(rootBlockNode, node); 
         rootBlockNode.append(node); 
        } else 
         rootBlockNode.append(node); 
       } else { 
        rootBlockNode = null; 
       } 

       node = next; 
      }; 
     }; 

Dies geschieht offensichtlich Pflege Wurzelblockelemente zu schaffen. Ich bin zu 99% sicher, dass tinymce den 'ENTER'-Tastenanschlag selbst behandelt und den Propagierungs-/Standard-Browser-Befehl stoppt.

+0

Ja, Sie sind richtig. Ich habe mir den Quellcode von tinymce genauer angesehen. Sie haben eine Klasse namens 'EnterKey.js'. Die Hauptfunktion in dieser Klasse ist 'handleEnterKey'. Tinymce fängt die – Amrit

+0

Dank für die Bestätigung, das ist, was ich dachte – Thariama