2012-06-14 18 views
5

Estoy tratando de implementar un editor WYSIWYG personalizado usando contenteditable<div>.opción forced_root_block en TinyMCE

Uno de los principales problemas que estoy enfrentando es la forma incoherente en que los navegadores manejan ENTER pulsación de teclas (saltos de línea). Inserciones de cromo <div>, insertos de Firefox <br> e insertos de IE <p>. Estaba echando un vistazo a TinyMCE y tiene una opción de configuración llamada forced_root_block. El ajuste forced_root_block a div realmente funciona en todos los principales navegadores. ¿Alguien sabe cómo la opción forced_root_block en TinyMCE puede lograrlo en todos los buscadores?

+0

+1 buena pregunta – Thariama

Respuesta

2

En la fuente tinymce (/tiny_mce/classs/dom/DomParser.js) se encuentran los siguientes:

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; 
      }; 
     }; 

Esto, obviamente, se encarga de la creación de elementos de bloque de raíz. Estoy 99% seguro de que tinymce maneja la tecla 'ENTER' y detiene el comando de propagación/navegador predeterminado.

+0

Yesm usted es la correcta. Eché un vistazo más profundo al código fuente de tinymce. Tienen una clase llamada 'EnterKey.js'. La función principal en esta clase es 'handleEnterKey'. Tinymce atrapa el – Amrit

+0

gracias por la confirmación, eso es lo que pensaba – Thariama