[Resolvido] Escrever em tempo real na div

[Elbrinner 0]

Boa tarde,

 

Estou com problema para mostrar os valores que estao dentro do campo imput quando começa.

 

 

Eu tenho assim:

<input name="pessoa" type="text" class="mini" id="pessoa" onkeyup="document.getElementById('pessoa').innerHTML = this.value" value="O SEÑOR" maxlength="40" />

E escrevo o conteudo do campo pessoa aqui

 

<div id = "pessoa" class="quem"></div>

O codigo funciona só que sempre tenho que da um espaço ou escrever alguma coisa para ele reconhecer o texto que já está no campo, como posso fazer para que ele reconhecer desdo principio o texto que leva dentro?

 

 

Obrigado

[GuttoSP 2]

Os dois elementos estão com a mesma ID, altera as IDs e coloca a função para ser ativada no evento onload.

[Elbrinner 0]

Vou testar, obrigado

[GuttoSP 2]

Seria como abaixo:

 

JAVASCRIPT

<script>

        function valor(val) {

                document.getElementById('pessoaDIV').innerHTML = val;

        }

        window.onload = valor(document.getElementById('pessoa').value);

</script>

<input name="pessoa" type="text" class="mini" id="pessoa" onkeyup="valor(this.value);" value="O SEÑOR" maxlength="40" />

<div id = "pessoaDIV" class="quem"></div>

[Elbrinner 0]

Está aparecendo um erro que não entendo.

 

Erro: document.getElementById("pessoa") has no properties

 

Esse erro é quando não tem o id da tag input certo? Mais eu copie exatamente o que você colocou a cima.

 

O erro da linha é esse:

window.onload = valor(document.getElementById('pessoa').value);

-----------------------------------------------------------------------------------

Post Mesclado

-----------------------------------------------------------------------------------

 

já funciona... estava chamando a função antes do codigo input, coloquei ela depois e funciona perfeitamente.

 

muito obrigado

 

-----------------------------------------------------------------------------------

Post Mesclado

-----------------------------------------------------------------------------------

 

Agora apareceu um erro estranho no IE7

 

Erro: Não implementado

 

Linha

window.onload = valor(document.getElementById('pessoa').value);

Obs: No FF funciona perfeito e sem erros.

 

-----------------------------------------------------------------------------------

Post Mesclado

-----------------------------------------------------------------------------------

 

Vou colocar o codigo todo

 

<script type="text/javascript">
	   function valor(val) {
				document.getElementById('pessoaDIV').innerHTML = val;
		}	
		function valor1(val) {
				document.getElementById('nomeDIV').innerHTML = val;
		}				
		function valor3(val) {
				document.getElementById('otrosDIV').innerHTML = val;
		}	
		function valor4(val) {
				document.getElementById('textoDIV').innerHTML = val;
		}	
		function valor5(val) {
				document.getElementById('dataDIV').innerHTML = val;
		}	
		
		
		
		window.onload = valor(document.getElementById('pessoa').value);
		window.onload = valor1(document.getElementById('nome').value);  
		window.onload = valor3(document.getElementById('otros').value);
		window.onload = valor4(document.getElementById('texto').value);
		window.onload = valor5(document.getElementById('data').value);
		
</script>

[GuttoSP 2]

Posta o HTML também.

[Elbrinner 0]

<div  id="vista">
	
				<div id = "pessoaDIV" class="quem"></div>
				<div id = "nomeDIV" class="nome"></div>
						<div id = "caixa2DIV" align="center" class="texto_v" >
								<div id = "otrosDIV"></div>
						</div>
						<br /><br />		
			================================= <B>Q.   E.   P.   D.</B> =================================
	
			<div id = "textoDIV" class="textoesquela"></div>
			<div id="logoesquela">
					<div id = "dataDIV" class="datagr"></div>
			</div>
	</div>		
	<p>La persona: (ej.: El señor / La Señora)<br />
		<input name="pessoa" type="text" class="mini" id="pessoa" onkeyup="valor(this.value);" value="O SEÑOR" maxlength="40" />
		<br />
	  Nombre: (ej.: Don Juan) <br />
	  <input name="nome" type="text" class="mini" id="nome" onkeyup="valor1(this.value);"  value="Don Antonio Vecino " size="50" maxlength="90" />
	  <br />
	  Texto dentro del quadro
	  <br />
	  <input name="otros"  type="text" class="mini" id="otros"  onkeyup="valor3(this.value);" value="VECIÑO DE <b>MARIL Nº 7 (FIESTRAS) </b>FINOU NO DÍA DE <b>HOXE </b><br/>AOS<b> 86 ANOS</b> DE IDADE" size="140" maxlength="255" />
	  <br />
	  Texto<br />
	  <textarea name="texto" cols="130" rows="15" class="mini" id="texto"  onkeyup="valor4(this.value);"><b>A súa esposa, Leonor Otero Villamayor; fillos: Alfonso, José e Rosina; fillos políticos: Sara López, María Aguirre e Tito Barcala; netos: Alfonso e Belén, María, Ignacio, Rosina Mª, Alejandro e Antía; bisnetos: Marta e Marcos; irmáns políticos, sobriños, bisobriños, curmáns e demais familia, </b><br /><br />
	Pregan as súas amizades e persoas piadosas o teñan presente nas súas oracións e a asistencia á condución do cadáver mañán mércores día 19 ás seis e media da tarde, dende o tanatorio ata a Igrexa Parroquial de SAN MARTIÑO DE FIESTRAS, onde ás sete se celebrará o funeral de corpo presente e seguidamente ao cemiterio de dita parroquia para a súa inhumación; anticipándolles as grazas.<br /><br /><b>Capela ardente: Tanatorio de Silleda - Velatorio 2.</b><br />

	</textarea>
	  <br />	
	  Fecha: (Ej.:Silleda, 18 de xullo de 2006) <br />
	  <input  name="data" type="text" class="mini"  id="data"  onkeyup="valor5(this.value);" value="Silleda, 18 de xullo de 2006" size="50" maxlength="40" />
	  </p>

-----------------------------------------------------------------------------------

Post Mesclado

-----------------------------------------------------------------------------------

 

A primeira função é chamada e o texto é carregado as outras não. Tirando as outras funçoes continua com o mesmo erro.

[GuttoSP 2]

Altere:

JAVASCRIPT

window.onload = valor(document.getElementById('pessoa').value);

        window.onload = valor1(document.getElementById('nome').value);  

        window.onload = valor3(document.getElementById('otros').value);

        window.onload = valor4(document.getElementById('texto').value);

        window.onload = valor5(document.getElementById('data').value);

 

Para...

JAVASCRIPT

window.onload = function () {

                        valor(document.getElementById('pessoa').value);

                        valor1(document.getElementById('nome').value);  

                        valor3(document.getElementById('otros').value);

                        valor4(document.getElementById('texto').value);

                        valor5(document.getElementById('data').value);

                }

[Elbrinner 0]

Funciono perfeito agora, entao é errado fazer o que eu fiz antes?

 

 

obrigado

[GuttoSP 2]

O evento onLoad é ativado quando todos os elementos da página são carregados completamente, e isso só acontece uma vez, então só a primeira chamada será respeitada. No seu caso, se fizer como abaixo, também funcionaria.

 

JAVASCRIPT

valor(document.getElementById('pessoa').value);

                        valor1(document.getElementById('nome').value);  

                        valor3(document.getElementById('otros').value);

                        valor4(document.getElementById('texto').value);

                        valor5(document.getElementById('data').value);

[Elbrinner 0]

ok, muito obrigado uma vez mais