Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Erick Allan

[Resolvido] Teclado Virtual

Por , em Javascript

Recommended Posts

Erick Allan    0

Erick Allan
Postado

Boa noite pessoal, seguinte estou fazendo um trabalho de faculdade e esse trabalho será no futuro implantado em mobile, como ainda nao implementamos em mobile fiz um layout simulando o mobile, fiz inclusive um teclado virtual (ai que está o problema).

 

Fiz todos os botões do teclado de A a Z e 0 a 9. só que ele insere os dados apenas no input text com o id PLACA, eu vou fazer mais campos e quero que insira o valor no campo que estiver onfocus, já tentei varios tipos de coisas mas não consegui de jeito nenhum.

 

segue o link www.unifai.edu.br/am

 

function Digita(valor)
{

	//pegando o elemento com o ID="placa_txt"
	var placa_txt = document.getElementById("placa_txt");
	//Insere (valor) no elemento "placa_txt"
	placa_txt.value += valor;
	placa_txt.focus();
}

 

esse código acima ele pega o value do botão e insere no campo, a parte de inserção funciona mas só funciona pois especifiquei o id.

 

gente não achei tópico nenhum a respeito..

HELP ME!!

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

pensei em algo do tipo:

function Digita(valor, id_elemento)
{
        var placa_txt = document.getElementById( id_elemento );
assim, você chamaria essa função, apartir do elemento que ganhar o focus.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Erick Allan    0

Erick Allan
Postado

pensei em algo do tipo:

function Digita(valor, id_elemento)
{
        var placa_txt = document.getElementById( id_elemento );
assim, você chamaria essa função, apartir do elemento que ganhar o focus.

 

Então só para ver se eu entendi... o código completo ficaria assim:

 


function Digita(valor, id_elemento)
{
        var campo = document.getElementById( id_elemento );
        //Insere (valor) no elemento "placa_txt"
        campo.value += valor;
        campo.focus();
}

e no botão e input assim:

 


<input type="text" maxlength="7" name="placa_txt" id="placa_txt" />
<input type="text" maxlength="7" name="nome" id="nome" />
<input type="button" value="Q" class="botao_topo_out" onclick="Digita(this.value)"/>

 

É isso?!

Obrigado...

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

hum.. não sei bem como você fez o teclado.. mas você precisa saber em qual input está o foco, para inserir o conteudo lá.

 

de primeira, pensei nisso:

<html>
<head> 
<script type="text/javascript">
function id( el ){
	return document.getElementById( el );
}
var focus = false;
window.onload = function(){
	id('botao1').onclick = function(){
		id( focus ).value += this.value;
	}
	id('botao2').onclick = function(){
		id( focus ).value += this.value;
	}
	id('botao3').onclick = function(){
		id( focus ).value += this.value;
	}
	id('botao4').onclick = function(){
		id( focus ).value += this.value;
	}
	var inputs = document.getElementsByTagName('input');
	for( var i=0; i<inputs.length; i++ ){
		inputs[i].onfocus = function(){
			focus = this.id;
		}
	}
}
</script>
</head>
<body>
	<form action="" method="post">
		<input type="text" name="entrada_1" id="entrada_1" /></label>
		<input type="text" name="entrada_2" id="entrada_2" /></label>
		<input type="text" name="entrada_3" id="entrada_3" /></label>
		
		<input type="button" name="1" value="1" id="botao1" />
		<input type="button" name="2" value="2" id="botao2" />
		<input type="button" name="3" value="3" id="botao3" />
		<input type="button" name="4" value="4" id="botao4" />
	</form>
</body>
</html>
como você está fazendo ?

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Assim cara, vai alimentar o button, se o foco estiver no button.

para contornar isso, é só alterar, de forma que a area clicavel seja uma, e a area a receber dados seja outra.

 

a intenção do fórum, não é entregar códigos prontos.

Mas ajudar em dúvidas.

 

Me interessei pelo problema, e fiz um esboço aqui:

<html>
<head> 
<script type="text/javascript">
function id( el ){
	return document.getElementById( el );
}
function val( destino, valor ){
	destino.value += valor;
}
var focus = false;
window.onload = function(){
	
	
	var botoes = id('teclado').getElementsByTagName('input');
	for( var i=0; i<botoes.length; i++ ){
		botoes[i].onclick = function(){
			if( !focus ){ alert('coloque o foco em algum input');exit(); }

			val( id( focus ), this.value );
			id( focus ).focus();
		}
	}
	
	var inputs = id('area').getElementsByTagName('input');
	for( var i=0; i<inputs.length; i++ ){
		inputs[i].onfocus = function(){
			focus = this.id;
		}
	}
	id('entrada_1').focus();
}
</script>
<style type="text/css">
#teclado { width: 300px;}
</style>
</head>
<body>
	<form action="" method="post">
		<fieldset id="area">
			<input type="text" name="entrada_1" id="entrada_1" /></label>
			<input type="text" name="entrada_2" id="entrada_2" /></label>
			<input type="text" name="entrada_3" id="entrada_3" /></label>
		</fieldset>
		<fieldset id="teclado">

<?php
	foreach( range('a','z') AS $letra )
		echo '<input type="button" name="'.$letra.'" value="'.$letra.'" />'."\n";
	for( $i=0; $i<10;$i++ ) 
	{
		echo '<input type="button" name="'.$i.'" value="'.$i.'" />'."\n";
	}
?>
		</fieldset>
	</form>
</body>
</html>

http://code.imasters.com.br/index.php?/topic/158-teclado-virtual-javascript/

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito