Ir para conteúdo
Fórum Script Brasil
  • 0

Teclado virtual para entrada de valores

lsmarco2008@gmail.com

Perguntado por lsmarco2008@gmail.com,

 Share

Pergunta

lsmarco2008@gmail.com

lsmarco2008@gmail.com

Postado
Postado
Olá amigos, sou novo no fórum e estou aprendendo HTML. Gostaria de pedir ajuda sobre um exemplo que estou tentando montar e que apesar de bem simples é muito importante para mim, tenho um campo para entrada de valores e se eu digito diretamente nele a máscara que configura o valor 9.999,99 funciona sem problemas, mas preciso que funcione desta maneira quando eu clicar nos botões de números também, mas não sei como jogar a função "MascaraMoeda" nos botões:
<form>
<table cellpadding="2" cellspacing="2" border="0">
<tr>
      <td colspan="3" align="center"><input type="text" id="valor" onKeyPress="return(MascaraMoeda(this,'.',',',event))" size="35"></td>
          
</tr>
<tr>       
      <td><input type="button" value="  1  " style="font-size:25px;" onclick = "document.getElementById('valor').value = return(MascaraMoeda(this.value.'.',',',event))"></td>  
      <td><input type="button" value="  2  " style="font-size:25px;" onclick = "document.getElementById('valor').value = return(MascaraMoeda(this.value.'.',',',event))"></td>  
      <td><input type="button" value="  3  " style="font-size:25px;" onclick = "document.getElementById('valor').value =document.getElementById('valor').value+ this.value"></td>         
</tr>
<tr>
      <td><input type="button" value="  4  " style="font-size:25px;" onclick = "document.getElementById('valor').value =document.getElementById('valor').value+ this.value"></td>  
      <td><input type="button" value="  5  " style="font-size:25px;" onclick = "document.getElementById('valor').value =document.getElementById('valor').value+ this.value"></td>  
      <td><input type="button" value="  6  " style="font-size:25px;" onclick = "document.getElementById('valor').value =document.getElementById('valor').value+ this.value"></td>         
</tr>
<tr>
      <td><input type="button" value="  7  " style="font-size:25px;" onclick = "document.getElementById('valor').value =document.getElementById('valor').value+ this.value"></td>  
      <td><input type="button" value="  8  " style="font-size:25px;" onclick = "document.getElementById('valor').value =document.getElementById('valor').value+ this.value"></td>  
      <td><input type="button" value="  9  " style="font-size:25px;" onclick = "document.getElementById('valor').value =document.getElementById('valor').value+ this.value"></td>         
</tr>
<tr>
     <td><input type="button" value="  0  " style="font-size:25px;" onclick = "document.getElementById('valor').value =document.getElementById('valor').value+ this.value"></td>  

     <td><input type="button" value="  C  " style="font-size:25px;" onclick = "document.getElementById('valor').value =document.getElementById('valor').value+ this.value"></td>         
</tr>
</table>
</form>

Link para o comentário
Compartilhar em outros sites

2 respostass a esta questão

Posts Recomendados

  • 0
lsmarco2008@gmail.com

lsmarco2008@gmail.com

Postado
  • Autor
Postado

<script type='text/javascript'>window.mod_pagespeed_start = Number(new Date());</script>

Olá amigos, sou novo no fórum e estou aprendendo HTML. Gostaria de pedir ajuda sobre um exemplo que estou tentando montar e que apesar de bem simples é muito importante para mim, tenho um campo para entrada de valores e se eu digito diretamente nele a máscara que configura o valor 9.999,99 funciona sem problemas, mas preciso que funcione desta maneira quando eu clicar nos botões de números também, mas não sei como jogar a função "MascaraMoeda" nos botões:
<form>
<table cellpadding="2" cellspacing="2" border="0">
<tr>
      <td colspan="3" align="center"><input type="text" id="valor" onKeyPress="return(MascaraMoeda(this,'.',',',event))" size="35"></td>
          
</tr>
<tr>       
      <td><input type="button" value="  1  " style="font-size:25px;" onclick = "document.getElementById('valor').value = return(MascaraMoeda(this.value.'.',',',event))"></td>  
      <td><input type="button" value="  2  " style="font-size:25px;" onclick = "document.getElementById('valor').value = return(MascaraMoeda(this.value.'.',',',event))"></td>  
      <td><input type="button" value="  3  " style="font-size:25px;" onclick = "document.getElementById('valor').value =document.getElementById('valor').value+ this.value"></td>         
</tr>
<tr>
      <td><input type="button" value="  4  " style="font-size:25px;" onclick = "document.getElementById('valor').value =document.getElementById('valor').value+ this.value"></td>  
      <td><input type="button" value="  5  " style="font-size:25px;" onclick = "document.getElementById('valor').value =document.getElementById('valor').value+ this.value"></td>  
      <td><input type="button" value="  6  " style="font-size:25px;" onclick = "document.getElementById('valor').value =document.getElementById('valor').value+ this.value"></td>         
</tr>
<tr>
      <td><input type="button" value="  7  " style="font-size:25px;" onclick = "document.getElementById('valor').value =document.getElementById('valor').value+ this.value"></td>  
      <td><input type="button" value="  8  " style="font-size:25px;" onclick = "document.getElementById('valor').value =document.getElementById('valor').value+ this.value"></td>  
      <td><input type="button" value="  9  " style="font-size:25px;" onclick = "document.getElementById('valor').value =document.getElementById('valor').value+ this.value"></td>         
</tr>
<tr>
     <td><input type="button" value="  0  " style="font-size:25px;" onclick = "document.getElementById('valor').value =document.getElementById('valor').value+ this.value"></td>  

     <td><input type="button" value="  C  " style="font-size:25px;" onclick = "document.getElementById('valor').value =document.getElementById('valor').value+ this.value"></td>         
</tr>
</table>
</form>

Com o KeyCode seria possível adpatar aos botões? Não sei como fazer esta adaptação, mas será que funcionaria?
document.body.onkeypress = function(){
var teclaClicada = event.keyCode;
//console.log(event.keyCode);
if(teclaClicada == "48"){
// 48 = 0
console.log("Sua tecla é 0");
}
};
Link para o comentário
Compartilhar em outros sites
  • 0
lsmarco2008@gmail.com

lsmarco2008@gmail.com

Postado
  • Autor
Postado

Procurei alguns modelos e ainda não consegui encaixar, meu problema é que quando digito diretamente na caixa a máscara separa os digítos 9,999.99, mas quando digito com os botões ficam os números na caixa um do lado do outro, estou postando o código completo alterado, se alguém puder testar e ver se consegue adaptar a função MascaraMoeda nos botões eu agradeço.

<form>

<table cellpadding="2" cellspacing="2" border="0">
<tr>
<td colspan="3" align="center"><input type="text" id="valor"onKeyPress="return(MascaraMoeda(this,'.',',',event))" size="35"></td>

</tr>
<tr>
<td><input type="button" value="1" style="font-size:25px;" onClick=addNumber(this); ></td>
<td><input type="button" value="2" style="font-size:25px;" onClick=addNumber(this); ></td>
<td><input type="button" value="3" style="font-size:25px;" onClick=addNumber(this); ></td>
</tr>
<tr>
<td><input type="button" value="4" style="font-size:25px;" onClick=addNumber(this); ></td>
<td><input type="button" value="5" style="font-size:25px;" onClick=addNumber(this); ></td>
<td><input type="button" value="6" style="font-size:25px;" onClick=addNumber(this); ></td>
</tr>
<tr>
<td><input type="button" value="7" style="font-size:25px;" onClick=addNumber(this); ></td>
<td><input type="button" value="8" style="font-size:25px;" onClick=addNumber(this); ></td>
<td><input type="button" value="9" style="font-size:25px;" onClick=addNumber(this); ></td>
</tr>
<tr>
<td><input type="button" value="0" style="font-size:25px;" onClick=addNumber(this); ></td>
<td><input type="button" value="C" style="font-size:25px;" onClick=addNumber(this); ></td>
</tr>
</table>
</form>

JavaScript
function addNumber(element){
return(MascaraMoeda(document.getElementById('valor').value =document.getElementById('valor').value+element.value,',','.',event));

}

function MascaraMoeda(objTextBox, SeparadorMilesimo, SeparadorDecimal, e){
var sep = 0;
var key = '';
var i = j = 0;
var len = len2 = 0;
var strCheck = '0123456789';
var aux = aux2 = '';
var whichCode = (window.Event) ? e.which : e.keyCode;
if ((whichCode == 13) || (whichCode == 0) || (whichCode == 8)) return true;
key = String.fromCharCode(whichCode);
if (strCheck.indexOf(key) == -1) return false;
len = objTextBox.value.length;
for(i = 0; i < len; i++)
if ((objTextBox.value.charAt(i) != '0') && (objTextBox.value.charAt(i) != SeparadorDecimal)) break;
aux = '';
for(; i < len; i++)
if (strCheck.indexOf(objTextBox.value.charAt(i))!=-1) aux += objTextBox.value.charAt(i);
aux += key;
len = aux.length;
if (len == 0) objTextBox.value = '';
if (len == 1) objTextBox.value = '0'+ SeparadorDecimal + '0' + aux;
if (len == 2) objTextBox.value = '0'+ SeparadorDecimal + aux;
if (len > 2) {
aux2 = '';
for (j = 0, i = len - 3; i >= 0; i--) {
if (j == 3) {
aux2 += SeparadorMilesimo;
j = 0;
}
aux2 += aux.charAt(i);
j++;
}
objTextBox.value = '';
len2 = aux2.length;
for (i = len2 - 1; i >= 0; i--)
objTextBox.value += aux2.charAt(i);
objTextBox.value += SeparadorDecimal + aux.substr(len - 2, len);
}
preço=objTextBox.value
return false;
}



End JavaScript

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.

×
 Share
Ir para lista de Perguntas


  • Estatísticas dos Fóruns

    • Tópicos
      152,1k
    • Posts
      651,8k
×
×
  • Criar Novo...