codigo javascript del boton Negrita, lo teneis?

xoi · #1 (**permalink**) 08/11/2006, 03:50

Necesito el codigo javascript que te pone en negrita el texto seleccionado y que si no tienes texto seleccionado te abre una llave.... y luego la cierra....
En fin necesito el codigo de cualquier formulario en general, por ejemplo el que utiliza esta pagina, para poner negrita o cursiva
Editar/Borrar Mensaje

dogduck · #2 (**permalink**) 08/11/2006, 05:01

Java no es JavaScript, pero si te vale este código que he visto:
http://www.php-hispano.net/foros/Javascript/13408

Código HTML:

<html>
<head>
<title>Editor bbcode</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script>
function instag(tag){
var input = document.form1.texto;
//para mac
if(typeof document.selection != 'undefined' && document.selection) {
var str = document.selection.createRange().text;
input.focus();
var sel = document.selection.createRange();
sel.text = "[" + tag + "]" + str + "[/" +tag+ "]";
return;
}else if(typeof input.selectionStart != 'undefined'){
var start = input.selectionStart;
var end = input.selectionEnd;
var insText = input.value.substring(start, end);
input.value = input.value.substr(0, start) + '['+tag+']' + insText + '[/'+tag+']'+ input.value.substr(end);
return;
}else{
  input.value+=' ['+tag+']Reemplace este texto[/'+tag+']';
  return;
}
}
</script>
<script>
function inslink(){
var input = document.form1.texto;
if(typeof document.selection != 'undefined' && document.selection) {
var str = document.selection.createRange().text;
  input.focus();
  var my_link = prompt("Enter URL:","http://");
  if (my_link != null) {
    var sel = document.selection.createRange();
    sel.text = "[a href=\"" + my_link + "\"]" + str + "[/a]";
  }
  return;
}else if(typeof input.selectionStart != 'undefined'){
var start = input.selectionStart;
var end = input.selectionEnd;
var insText = input.value.substring(start, end);
var my_link = prompt("Enter URL:","http://");
if (my_link != null) {
input.value = input.value.substr(0, start) +"[a href=\"" + my_link + "\"]" + insText  + "[/a]"+ input.value.substr(end);
}
return;
}else{
var my_link = prompt("Ingresar URL:","http://");
var my_text = prompt("Ingresar el texto del link:","");
input.value+=" [a href=\"" + my_link + "\"]" + my_text + "[/a]";
return;
}
}
</script>
</head>

<body>
<form name="form1" method="post" action="">
<input type="button" name="Submit" value="B" onclick="instag('b')">
  <input type="button" name="Submit3" value="U" onclick="instag('u')">
<input type="button" name="Submit4" value=" I " onclick="instag('i')">
  <input type="button" name="Submit2" value="LINK" onclick="inslink()">
  <br>
  <textarea name="texto" cols="40" rows="10" id="texto"></textarea>
  
</form>
</body>
</html>

Impalss · #3 (**permalink**) 06/09/2009, 17:13

Buenas, buen codigo, ahora mi pregunta, ¿como poder mostrar una vista previa del mensaje??

MiLLeN · #4 (**permalink**) 07/09/2009, 05:25

Cita:

Iniciado por Impalss

Buenas, buen codigo, ahora mi pregunta, ¿como poder mostrar una vista previa del mensaje??

Pues con mas javascript.

Capturas el evento de cambio del elemento que sea, y copias su contenido en el elemento donde lo quieras mostrar.

skdna · #5 (**permalink**) 15/11/2009, 14:10

Cita:

Iniciado por Impalss

Buenas, buen codigo, ahora mi pregunta, ¿como poder mostrar una vista previa del mensaje??

yo haria un "submit" a otra pagina por post, y en la otra pagina capturo el texto y lo transformo por medio de PHP el codigo para transformar quedaria mas o menos asi:

pagina html1 = "tu_index.php"

Cita:

Colocando en el Head claro esta el script de dogduck para los botones :P

Código HTML:

<form action="validaciones.php" method="post" name="form1" >
<input type="button" name="Submit" value="B" onclick="instag('b')">
  <input type="button" name="Submit3" value="U" onclick="instag('u')">
<input type="button" name="Submit4" value=" I " onclick="instag('i')">
  <input type="button" name="Submit2" value="LINK" onclick="inslink()">
  <br>
<textarea name="texto" class="tam" id="texto"><?php if(isset($_POST['cadena'])) { $mostrar = $_POST['cadena']; echo $mostrar; } ?></textarea><br />
<input type="submit" name="Enviar" value="Mostrar" />
</form>

pagina php = "validaciones.php"

Código PHP:

  <?php
    $bbcode = array();
    $xhtml = array();
    $mensaje = $_POST["texto"];
    
    $bbcode[] = "[i]"; $xhtml[] = "<em>";
    $bbcode[] = "[/i]"; $xhtml[] = "</em>";
    
    $bbcode[] = "[b]"; $xhtml[] = "<strong>";
    $bbcode[] = "[/b]"; $xhtml[] = "</strong>";
    
    $bbcode[] = "[imagen]"; $xhtml[] = "<img src='";
    $bbcode[] = "[/imagen]"; $xhtml[] = "' />";
    
    $bbcode[] = "[size=25]"; $xhtml[] = "<h1>";
    $bbcode[] = "[/size]"; $xhtml[] = "</h1>";    

    $cadena = str_replace($bbcode,$xhtml,nl2br($mensaje));
    echo "<table align='center' class='tam'>";
    echo  "<tr><td>".$cadena."</td></tr></table>";

?>

Luego para regresar hago otro boton submit que me regrese a la pagina anterior y me cargue todo el texto que habia escrito

Código HTML:

<form action="tu_index.php" method="post">
<input type="hidden" value="<?php echo $mensaje; ?>" name="cadena">
<input type="submit" value="Editar">
</form>