Editor de Textareas Propio - Problema

Alcalina · #1 (**permalink**) 05/06/2009, 05:26

Código HTML:

<html>
<head>
<title>Editor Textos Javascript</title>
<script language='javascript'>
function insertarBBCode(boton)
{
  var area = 'pruebas';
  var contenido = document.getElementById(area).innerHTML;
  var bbcode = null;
  
  if (boton.name=='B') bbcode = '[b][/b]';
  if (boton.name=='I') bbcode = '[i][/i]';
  if (boton.name=='U') bbcode = '[u][/u]';
  if (boton.name=='S') bbcode = '[s][/s]';
  if (boton.name=='LIST') bbcode = '\n[list]\n[li][/li]\n[li][/li]\n[/list]';
  if (boton.name=='HR') bbcode = '\n[hr]';
  if (boton.name=='IMG') bbcode = '\n[img][/img]';
  if (boton.name=='URL') bbcode = '[direccion][/direccion]';
  if (boton.name=='YOUTUBE') bbcode = '\n[youtube](Código del Video)[/youtube]';
  if (boton.name=='ALIGNCENT') bbcode = '[align=center][/align]';
  if (boton.name=='ALIGNIZQ') bbcode = '[align=left][/align]';
  if (boton.name=='ALIGNDER') bbcode = '[align=right][/align]';
  if (boton.name=='CODE') bbcode = '\n[code][/code]';
    
  document.getElementById(area).innerHTML = contenido + bbcode;
}
</script>
</head>
<body bgcolor='#AAAAAA'>
<input type='button' name='B' value='B' onClick='insertarBBCode(this);'>
<input type='button' name='I' value='I' onClick='insertarBBCode(this);'>
<input type='button' name='U' value='U' onClick='insertarBBCode(this);'>
<input type='button' name='S' value='S' onClick='insertarBBCode(this);'>
<input type='button' name='LIST' value='LIST' onClick='insertarBBCode(this);'>
<input type='button' name='HR' value='HR' onClick='insertarBBCode(this);'>
<input type='button' name='IMG' value='IMG' onClick='insertarBBCode(this);'>
<br>
<input type='button' name='URL' value='URL' onClick='insertarBBCode(this);'>
<input type='button' name='YOUTUBE' value='YOUTUBE' onClick='insertarBBCode(this);'>
<input type='button' name='ALIGNCENT' value='CENTRO' onClick='insertarBBCode(this);'>
<input type='button' name='ALIGNIZQ' value='IZQUIERDA' onClick='insertarBBCode(this);'>
<input type='button' name='ALIGNDER' value='DERECHA' onClick='insertarBBCode(this);'>
<input type='button' name='CODE' value='CODE' onClick='insertarBBCode(this);'>

<br>
<textarea id='pruebas' name='pruebas' cols='60' rows='5'>
</textarea>
</body>
</html>

Teniendo este código, me permite insertar en el textarea los bbcodes necesarios según el botón que pulse, el problema viene que a partir de que introduzco cualquier caracter en el textarea despues o antes de insertar, ya no me inserta nada de los botones en el textarea y no veo el problema, alguna ayuda?

Gracias adelantadas

Adler · #2 (**permalink**) 05/06/2009, 06:13

Hola

Mira aquí tienes un editor de texto by Caritatos

Suerte

Alcalina · #3 (**permalink**) 05/06/2009, 07:25

Leyendo el código que a usado el, también lo hace por innerHTML... aquí hay algo que se me escapa pues me sigue pasando igual T_T', gracias por la respuesta pero lo de los prompt para insertar valores no me convencen, yo solo pretendo insertar texto simple, y aunque debería funcionar, pues funciona a "medias" xD

Panino5001 · #4 (**permalink**) 05/06/2009, 07:28

Fijate si te sirve este enlace:
http://www.disegnocentell.com.ar/notas2.php?id=131
También te sugiero este:
http://www.disegnocentell.com.ar/notas2.php?id=206

Adler · #5 (**permalink**) 05/06/2009, 08:06

Hola

Cita:

Iniciado por Alcalina

Leyendo el código que a usado el, también lo hace por innerHTML... aquí hay algo que se me escapa pues me sigue pasando igual T_T', gracias por la respuesta pero lo de los prompt para insertar valores no me convencen, yo solo pretendo insertar texto simple, y aunque debería funcionar, pues funciona a "medias" xD

En cuanto a los promts puedes modificar el script para que inserte directamente

Suerte

Alcalina · #6 (**permalink**) 07/06/2009, 14:40

Código HTML:

function insertarBBCode(boton)
{
  var contenido = document.getElementById(area).innerHTML;
  var bbcode = null;
  
  document.getElementById(area).innerHTML = contenido + bbcode;
}

Bueno, ese código estaba mal, al final di con la solución por mi cuenta, gracias por las ayudas, tendré en cuenta los fallos que corrigieron, pero ellos lo han hecho igual que lo tenia yo, asi que lo solucione cambiando el obtener y el insertar de nuevo, obteniendolo como elemento html que es.

Código HTML:

var contenido = document.forms[0].pruebas.value; // Obtención
document.forms[0].pruebas.value = contenido + bbcode; // Inserción

Saludos