div editável

[teste 0]

Seguinte pessoas,tem uma div editável

<div id="editor"  CONTENTEDITABLE align="left"  style="border:1px solid; width:300px; height:40px; font-face:Arial; padding:3;    							                 overflow:auto;" >conteúdo</div>

Como faço para limitar a quantidade de caracteres para 50?Obrigado

[Paulo de Tarso F. M. 24]

Só me explica como se faz para alterar o conteúdo de uma div... http://forum.imasters.com.br/public/style_emoticons/default/assobiando.gif

 

Até então, eu só conseguia editar em inputs, mas em divs eu nunca tinha ouvido falar...

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[teste 0]

Só me explica como se faz para alterar o conteúdo de uma div... http://forum.imasters.com.br/public/style_emoticons/default/assobiando.gif

 

Até então, eu só conseguia editar em inputs, mas em divs eu nunca tinha ouvido falar...

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Do jeito que está aqui já é editável:

 

http://forum.imasters.com.br/public/style_emoticons/default/closedeyes.gif

<div id="editor"  CONTENTEDITABLE  align="left"  style="border:1px solid; width:300px; height:40px; font-face:Arial; padding:3;    							                 overflow:auto;" >conteúdo</div>

Porque fiz isso? Para poder aplicar um innerHTML. Já que preciso enviar os dados formatados (com tags HTMLs) para a base de dados.

 

O problema é que não sei como limitar o número de caracteres digitados.

[vagner.net 0]

Apesar do atributo CONTENTEDITABLE, não ser Crossbrowser, para o IE da pra fazer tranquilo, a função ficaria assim:

<script>function edit(e){		try{var elemento	= e.target		  }catch(er){};	try{var elemento	= event.srcElement  }catch(er){};		if(elemento.firstChild.data.length >= 50) return false;	  }window.onload=function(){	document.getElementById('editor').onkeypress = edit;}</script><div id="editor"  CONTENTEDITABLE  style="text-align:left;border:1px solid;width:300px;height:40px;font-face:Arial;padding:3;overflow:auto;" >TESTE</div>

OK..!!?? T+...

[MadPatryk 0]

width nela...e no teu javascript, senao me engano pra funcionar nos outros browsers e na bosta do IE tbm, você usa maxLength (com o L maiusculo mesmo) no teu obj input (se você estiver criando um)...

[teste 0]

Apesar do atributo CONTENTEDITABLE, não ser Crossbrowser, para o IE da pra fazer tranquilo, a função ficaria assim:

<script>function edit(e){		try{var elemento	= e.target		  }catch(er){};	try{var elemento	= event.srcElement  }catch(er){};		if(elemento.firstChild.data.length >= 50) return false;	  }window.onload=function(){	document.getElementById('editor').onkeypress = edit;}</script><div id="editor"  CONTENTEDITABLE  style="text-align:left;border:1px solid;width:300px;height:40px;font-face:Arial;padding:3;overflow:auto;" >TESTE</div>

OK..!!?? T+...

A princípio tudo ficou ok, a não ser pelo fato de quando eu digito o Enter o javascript dispara um erro e a validação passa a não ser mais executada.

 

O que deve ser passado como parâmetro no edit da function acima?

[vagner.net 0]

Nada... aquela variável é só para captura de evento, aliás se você só vai utilizar para o IE, nem precisa dela:

function edit(){ if(event.srcElement.firstChild.data.length >= 50) return false; }

OK..!!?? T+...

[teste 0]

Certo...

 

e com relação a tecla Enter?

 

o que acontece é o seguinte: quando estou digitando algo, antes de chegar aos 50 caracteres, eu preciono a tecla enter. Até então tudo bem, mas quando digito outra tecla em seguida, a letra A por exemplo, o javascript lança o seguinte erro: 'firstChild.data.length' is null or not an object.

[MadPatryk 0]

nossa, pensei que ele tava criando um input com o dom...desse jeito n vai funcionar nunca nos outros browsers...mas...:)

[vagner.net 0]

Pega o retorno do innerHTML da DIV e usa uma Expressão Regular para eliminar as TAG's e outros caracteres que não precisam ser contados, assim você extrai apenas o texto e verifica o length.