TextArea Editor

George Gomes · Julho 7, 2009

Pessoal é o seguinte !!

tenho o código abaixo só q não consigo fazer com q a textarea funcione corretamente!

quando eu clico na formatação ele não atribui o ID para a text area se fosse em um frame daria certo, o unico problema é q no frame eu não consegui fazer a quebra de linha: exemplo, quando chegar no final do frame o texto descer automáticamente, se souberem de algum jeito agradesço.

<html>
<head>
<title>Teste Criar um Editor de Texto...</title>
<link rel="stylesheet" href="style.css">
<style type="text/css">
a:link {text-decoration:none};
a:visited {text-decoration:none};
a:hover{text-decoration:none};
a:active{text-decoration:none};
</style>

<script language="JavaScript">

function teste(){

var n=navigator.appVersion;
var v=n.indexOf("NT");
var versao=n.charAt(v+3)
if(versao=="6"){
alert("Windows Vista");
}else if(versao=="5"){
alert("Windows XP")
}

}

function iniciar(){
editor.document.designMode='On';
}
function italico(){
editor.document.execCommand('italic',false,null);
}
function negrito(){
editor.document.execCommand('bold', false,null); 
}
function sublinhado(){
editor.document.execCommand('underline',false,null);
}
function alinhado_esquerda(){
editor.document.execCommand('justifyleft',false,null);
}
function alinhado_direita(){
editor.document.execCommand('justifyright',false,null);
}
function alinhado_centro(){
editor.document.execCommand('justifycenter',false,null);
}
function undo(){
editor.document.execCommand('undo',false,null);
}
function redo(){
editor.document.execCommand('redo',false,null);
}
function recortar(){
editor.document.execCommand('cut',false,null);
}
function colar(){
editor.document.execCommand('paste',false,null);
}
function copiar(){
editor.document.execCommand('copy',false,null);
}
function marcador(){
editor.document.execCommand('insertunorderedlist',false,null);
}
function numeracao(){
editor.document.execCommand('insertorderedlist',false,null);
}
function fonte(fonte){
if(fonte!='')
editor.document.execCommand('fontname',false,fonte);
}
function tamanho(tamanho){
if(tamanho!='')
editor.document.execCommand('fontsize',false,tamanho);
}


</script>
</head>
<body onLoad="iniciar()" bgcolor="#EFEDE1">
<div id="Menu_Topo">
<table border="0">

<tr>
<td>

<!Fonte>
<select name="fonte" onChange="fonte(this.options[this.selectedIndex].value)">
<option value=""></option>
<option value="Arial">Arial</option>
<option value="Arial Black">Arial Black</option>
<option value="verdana">Verdana</option>
<option value="Georgia">Georgia</option>
<option value="batang">Batang</option>
<option value="calibri">Calibri</option>
<option value="Times New Roman">Times New Roman</option>
</select>

<!Tamanho>
<select name="tamanho" onChange="tamanho(this.options[this.selectedIndex].value)">
<option value=""></option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>

</select>

</td>
<td>
<center>
<!Itálico>
<img src="imagens\italico.gif" onClick="italico()" style="cursor:hand">

<!Negrito>
<img src="imagens\negrito.gif" onClick="negrito()" style="cursor:hand">

<!Sublinhado>
<img src="imagens\sublinhado.gif" onClick="sublinhado()" style="cursor:hand">

<!Alinhado Esquerdo>
<img src="imagens\alinhamentoesquerda.gif" onClick="alinhado_esquerda()" style="cursor:hand">

<!Centralizado>
<img src="imagens\centralizado.gif" onClick="alinhado_centro()" style="cursor:hand">

<!Alinhamento Direita>
<img src="imagens\alinhamentodireita.gif" onClick="alinhado_direita()" style="cursor:hand">

<!Desfazer>
<img src="imagens\desfazer.gif" onClick="undo()" style="cursor:hand">

<!Refazer>
<img src="imagens\refazer.gif" onCLick="redo()" style="cursor:hand">

<!Recortar>
<img src="imagens\recortar.gif" onclick="recortar()" style="cursor:hand">

<!Colar>
<img src="imagens\colar.gif" onClick="colar()" style="cursor:hand">

<!Copiar>
<img src="imagens\copiar.gif" onCLick="copiar()" style="cursor:hand">

<!Marcador> 
<img src="imagens\marcador.gif" onClick="marcador()" style="cursor:hand">

<!Numeração>
<img src="imagens\numeracao.gif" onClick="numeracao()" style="cursor:hand">



</center> 
</td>
</tr>
</table>
</div>

<div id="Frame">
<center>
<fieldset>
<textarea name="editor" id="editor">Digite sua mensagem aqui !</textarea> 
</fieldset>
</div>

</body>
</html>

Jonathan Queiroz · Julho 7, 2009

Ao invés de:

editor.document.propriedade

Use:

editor.propriedade

George Gomes · Julho 8, 2009

Cara você não poderia me dar outra ajudinho não !!!

é o seguinte eu queria adicionar modificar a cor e criar tabela nesse editor mas não sei fazer isso usando o execCommand !!

você poderia me ajudar?

George Gomes · Julho 8, 2009

como se cria uma tabela dinamicamente?

Jonathan Queiroz · Julho 8, 2009

Como assim "criar tabela dinamicamente" ?

Seria adcionar uma tabela ao corpo da página ?

George Gomes · Julho 8, 2009

Irei te dizer o meu problema cara!

é o seguinte !!

eu tenho q fazer um editor de textos em javascript porque o que tinha em DHTML q era super eficiente esta com o problema q não funciona em windows vista, eles descontinuaram o ActiveX q controla o DHTML, entaum estou tentando fazer um editor em javascript.

Esse editor em DHTML, criava também uma tabela em uma textarea entendeu??

eu seleciona quantas linhas e colunas eu queria e ele montava a tabela na textarea !!

É isso q eu preciso !!

Entrar

TextArea Editor

Pergunta

George Gomes

Link para o comentário

Compartilhar em outros sites

5 respostass a esta questão

Posts Recomendados

Jonathan Queiroz

Link para o comentário

Compartilhar em outros sites

George Gomes

Link para o comentário

Compartilhar em outros sites

George Gomes

Link para o comentário

Compartilhar em outros sites

Jonathan Queiroz

Link para o comentário

Compartilhar em outros sites

George Gomes

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades