2009-06-04 9 views
6

Quiero poner una llamada a función en mis páginas llamada enableTinyMCE(); En esa función, quiero ver si hay algún área de texto en mi página y, de ser así, hacer la función tinyMCE.init(). ¿Cómo puedo detectar si hay elementos de texto en la página?¿Cómo encontrar/detectar cualquier área de texto en la página usando jQuery?

+0

¿Por qué $ ('textarea'). longitud resultado de 4? – Jon

+0

No importa si solo quiere saber si hay al menos uno. – karim79

+0

bien. si el $ ('textarea'). length> 0 necesito incluir el

2

Un selector jQuery siempre devuelve una matriz incluso si no se encuentran elementos de las características determinadas. Esto significa que debe verificar la longitud. Prueba esto en su lugar.

if($('textarea').length > 0) {  
document.write('we have at least one textarea'); 
} 
1

he hecho lo siguiente como se sugiere sin embargo que todavía sólo quiero llamar enableTinyMCE si hay áreas de texto en mi página. No puedo llamar a esta función en document.ready. Ver Google! ¿Algunas ideas?

$(function() { 

    if ($('textarea').length > 0) 
    { 
     var data = $('textarea'); 
     $.each(data, function(i) 
     { 
     tinyMCE.execCommand('mceAddControl', false, data[i].id); 
     } 
     ); 
    } 

}); 

function enableTinyMCE() 
{ 
     tinyMCE.init({ 
      plugins: 'paste', 
      theme_advanced_toolbar_location: 'top', 
      theme_advanced_buttons1: 'pastetext,pasteword,copy,cut,separator,bold,italic,underline,separator,bullist,numlist,separator,undo,redo,separator,link,unlink,separator,charmap,separator,formatselect,separator,code', 
      theme_advanced_buttons2: '', 
      theme_advanced_buttons3: '', 
      mode: 'textareas', 
      theme: 'advanced', 
      theme_advanced_blockformats: 'None=p,Heading 3=h3,Heading 2=h2' 
     }); 
} 

la tinymce.init necesario recurrir a las afueras de documentReady pero $ ('textarea'). Longitud es siempre cero fuera de documentReady. ¡Ayuda!

+0

¿Por qué el tinymce necesita ser llamado fuera de document.ready? el documento. listo es para asegurarse de que el DOM esté registrado por el navegador – TStamper

+0

Lo he encontrado - http://www.latenightpc.com/blog/archives/2008/06/09/setting-up-tinymce-with-jquery -and-cakephp-12 pero lo estoy haciendo de forma dinámica, así que no sé la id de las áreas de texto. Además, ¿qué sucede si tiene más de un área de texto – Jon

+0

? El selector de jquery que está utilizando ($ ('textarea') no busca el ID. Busca todas las etiquetas que textarea – TStamper

4

Expandir en karim79 respuesta.

Desde jQuery docs page: Nota: No siempre es necesario comprobar si existe un elemento. El siguiente código mostraría el artículo si existe, y no haría nada (no hay errores) si no lo hiciera.

Qué eso significa es que usted puede hacer:

$(function(){ 
    $("textarea").each(function(i){ 
     this.enableTinyMCE(); 
    }) 
}) 

Editar:

En realidad, hay un plugin de jQuery siendo desarrollado para este propósito. Me gustaría descargar y probar el complemento y contribuir a su desarrollo si puedes.

jq-tinyMCE

0

Esta es mi solución

if ($('textarea').length > 0) 
    { 
     var data = $('textarea'); 
     $.each(data, function(i) 
     { 
     tinyMCE.execCommand('mceAddControl', false, data[i].id); 
     } 
     ); 

     $('form').bind('form-pre-serialize', function(e) { 
      tinyMCE.triggerSave(true,true); 
     }); 
    } 

Y para que TinyMCE he hecho esto

<% if (ViewData["TextAreaVisible"] != null && bool.Parse(ViewData["TextAreaVisible"].ToString()) == true) 
    {%> 
     <script type="text/javascript" src="../../Scripts/tinymce/tiny_mce.js"></script> 
     <script type="text/javascript"> 
      enableTinyMCE(); 
     </script> 
<%} %> 

EnableTinyMCE hace esto

function enableTinyMCE() { 

    tinyMCE.init({ 
     plugins: 'paste', 
     theme_advanced_toolbar_location: 'top', 
     theme_advanced_buttons1: 'pastetext,pasteword,copy,cut,separator,bold,italic,underline,separator,bullist,numlist,separator,undo,redo,separator,link,unlink,separator,charmap,separator,formatselect,separator,code', 
     theme_advanced_buttons2: '', 
     theme_advanced_buttons3: '', 
     mode: 'none', 
     theme: 'advanced', 
     theme_advanced_blockformats: 'None=p,Heading 3=h3,Heading 2=h2' 
    }); 

}

5

Vale la pena señalar que la funcionalidad que busca puede ser manejado por sí TinyMCE:

Si establece el parámetro mode-textareas en su tinyMCE.init() llamada, éste se convertirá automáticamente cualquier textareas encuentra en las instancias del editor. Si no hay textareas, no hará nada, silenciosamente.

tinyMCE.init({ 
    ... 
    mode : "textareas", 
    ... 
}); 

Por el contrario, se podría decir TinyMCE convertir sólo áreas de texto que coinciden con un nombre de clase CSS utilizando el valor specific_textareas al parámetro mode.

tinyMCE.init({ 
    ... 
    mode : "specific_textareas", 
    editor_selector : "mceEditor" 
}); 

http://wiki.moxiecode.com/index.php/TinyMCE:Configuration/mode

Cuestiones relacionadas