(Resolvido) 4 Dúvidas Básicas JavaScript!

Tesla · Março 28, 2009

tipo eu manjo mais mesmo de php + mysql, mas to vendo q vou ter q recorrer ao javascript mesmo, é uma linguagem mt manera, então to querendo fazer um rich text editor bem simples pro meu site, e tenho duas dúvidas:

1º

Como que eu vou fazer para armazenar em uma string o texto q estiver selecionado pelo usuário?

Edit---

opa achei isto: getSelection()

mas tah falando q só funciona com NetScape, é verdade?

2º

Como eu faço pra imprimir por exemplo um texto em uma table do html em javascript de forma dinâmica, exemplo:

um contador de caracteres que imprime a quantidade de caracteres de uma textarea?

3º

Como eu faço igual acontece aki no standart editor para que apareça negrito na textarea?

4º

Como eu faço uma condição pra por exemplo: se as teclas precionadas forem Ctrl+B?

Obrigado e espero as resposta ^^

Editado Março 28, 2009 por Tesla

Tesla · Março 28, 2009

bom como sou insistente, não fiquei parado esperando a resposta e consegui fazer meu rich text editor!!!!

só tenho um problema,

no IE ele ao invés de só incrementar por exemplo as tags de negrito, ele repete a string toda e coloca a tag!!!! Como Resolvo?

exemplo:

a string era : 123456789,
quando eu aperto negrito com a seleção do 4 ao 6, ao invés dele colocar isso: 123[b]456[/b]789 na textarea ele coloca: 123[b]456[/b]789123[b]456[/b]789

tah ae o code:

<html>

<head>

</head>

<body>
<script language="JavaScript">
// Função Para Formatar em HTML Criado Por Tesla
function ok (fmt, ID) {
//----------- Pega o Elemento pela ID
var textarea = document.getElementById(ID);
//----------- Localiza Início da Seleção
var txtstart = textarea.selectionStart;
//----------- Localiza Fim da Seleção
var txtend = textarea.selectionEnd;
//----------- Pega a String do Elemento
var txtvalue = textarea.value;
//----------- Tamanho da String do Elemento
var txtlen = txtvalue.length;
//----------- Parte 1 da String do Elemento
var txtfirst = txtvalue.substring(0,txtstart);
//----------- Parte 2 da String do Elemento
var txtsb = txtvalue.substring(txtstart,txtend);
//----------- Parte 3 da String do Elemento
var txtlast = txtvalue.substring(txtend,txtlen);
//----- Tipo de Formatação
if (fmt == "negrito") { // Negrito
var total = "[b]" + txtsb + "[/b]";
}
else if (fmt == "italico") { // Itálico
var total = "[i]" + txtsb + "[/i]";
}
// Junta a String Toda No Final e Envia Para O Elemento
textarea.value = txtfirst + total + txtlast;
}
</script>

<form name="formx">
<input type="button" value="Negrito" onMouseDown="ok('negrito', 'texto')">
<input type="button" value="Itálico" onMouseDown="ok('italico', 'texto')">
<br>
<textarea rows="20" cols="80" id="texto"></textarea>
</form>
</body>

</html>

.Andreia. · Março 30, 2009

bom como sou insistente, não fiquei parado esperando a resposta e consegui fazer meu rich text editor!!!!

muito bem é isso ae ;)

veja se esse exemplo te ajuda:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">
// globals
var curSelVal = "";
var startPos = 0;
var endPos = 0;

// functions
function storeCurVal(obj, start, end) {
// function not called if IE 4+
startPos = obj.selectionStart;
endPos = obj.selectionEnd;
curSelVal = document.forms[0].copy.value;
}

function getSel(tag)
{ 
 if(document.selection){
   oldString = document.selection.createRange().text;
 if (oldString != "") {
  document.selection.createRange().text = '<' + tag + '>' + oldString + '</' + tag + '>';
 }
    return false;
 } else if(window.getSelection){
 oldString = curSelVal;
 newString = '';
 finalString = '';
 len = curSelVal.length; // length of current string
 if (len > 0 && document.forms[0].copy.value.length > 0) {
  // get from beginning of string to start position
  firstPart = oldString.substring(0, startPos);
  // get from end of selection to end of total string
  lastPart = oldString.substring(endPos, len);

  // store the new string
  for (i=startPos; i<endPos; i++) {
   newString += oldString[i];
  }
  // surround it with the proper tag
  finalString = '<' + tag + '>' + newString + '</' + tag + '>';

  // rewrite it back into the textarea
  document.forms[0].copy.value = firstPart + finalString + lastPart;
 } else {
  curSelVal = "";
 }
 } else if(document.getSelection){ // don't know which browser would actually call this
    txt = obj.setSelectionRange(obj.selectionStart, obj.selectionEnd);
 }

}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>

<body>
<form action="" method="post">
<INPUT type="button" name="selectString" value="Negrito" onClick="getSel('b')" style="font-weight:bold"> 
<INPUT type="button" name="selectString" value="Sublinhado" onClick="getSel('u')" style="text-decoration:underline"> 
<INPUT type="button" name="selectString" value="Itálico" onClick="getSel('i')" style="font-style:italic"> <br>
<textarea name="copy" id="copy" cols="50" rows="15" onselect="if (!document.selection) storeCurVal(this);"></textarea>
</form>
</body>
</html>

Entrar

(Resolvido) 4 Dúvidas Básicas JavaScript!

Pergunta

Tesla

Link para o comentário

Compartilhar em outros sites

2 respostass a esta questão

Posts Recomendados

Tesla

Link para o comentário

Compartilhar em outros sites

.Andreia.

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades