•  
     

Problemas na calculadora HTML

Fiz uma calculadora HTML como o professor mandou, mas estou com erros nela nao sei aonde aparentemente ela esta de boa visual igual ele falou funcionando mas quando vou tentar fazer alguma conta pelo mouse os numeros ficam tudo no primeiro visor
Imagem
ai ta o 123 ai coloco + - ou qualquer outro nao da testa com teclado e sem teclado para ver
Calculadora2.rar
(1.19 KiB) Transferido 131 vezes
 
Não entendi

Você tem que colocar os dois números e depois clicar no + ou -
 
Quando vai colocar o valor 2 com o mouse ele adiciona os numeros junto com o valor 1 o valor fica, mas com o teclado vai normal
 
Vamos por partes para você poder tirar 10.

Sua calculadora está visualmente funcional.. mas semanticamente tem alguns erros, são eles:
- Todo elemento input tem que ter um atributo name único e seus botões nenhum deles tem um name, sugiro trocar para <button></button> ou colocar os name="btn1", name="btn2"...... isso corrigirá o bug de qnd vc clica em qq botão na calculador o botao 1 é visualmente pressionado junto com os outros.

- o attibruto ID deve ser único na página pelo que vi vc esta usando id como se fosse uma classe então sugiro mudar de id="button" para class="button", e no css mude de #button para .button

Vamos a lógica...

O que você precisa fazer é armazenar o tipo da operação qnd o usuário clicar em algum botão de operação, então para isso é preciso criar um variável global chamada operador (ou qq outro nome que você quiser) para receber o tipo da operação que o usuário quer fazer. Logo você precisa criar uma função que jogue o valor do tipo da operação escolhida no click do botão para a var operador

Para passar automaticamente para o segundo campo, você precisa checar se o usuário já escolheu o tipo da operação. Então você precisará alterar a função preencher() para :
# Se a variável operador estiver vazia (usuário ainda nao escolheu a operação), então jogue os números no campo 1
# Caso contrário jogue no campo 2

Você precisará resetar a variável operador caso usuário clique no botão limpar, para que ao clicar e um número ele volte a ser inserido no botão 2

E por fim para evitar bugs no campo 1 você tem que se garantir que o usuário apenas possa gravar o tipo da operação caso ja tenha digitado algo no campo 1.. caso contrário não faça nada, ou seja, não armazene o tipo da operação caso não tenha nada no campo 1, o lugar para você fazer essa checagem é a função que você criou para armazenar o tipo da operação.

Parece muito mas qnd vc ver o código verá que é besteirinha msm...

Em anexo segue seu projeto alterado apenas para funcionar como previsto, não alterei a parte da semantica que eu citei no inicio do post..
Lógico da pra melhorar muito ainda a lógica .. mas só com isso sua calculadora já está funcional em todas as operações.

QQ coisa posta aee

[]'s
Anexos
Calculadora2.rar
(1.41 KiB) Transferido 117 vezes
 
bRuc3 Escreveu:Vamos por partes para você poder tirar 10.

Sua calculadora está visualmente funcional.. mas semanticamente tem alguns erros, são eles:
- Todo elemento input tem que ter um atributo name único e seus botões nenhum deles tem um name, sugiro trocar para <button></button> ou colocar os name="btn1", name="btn2"...... isso corrigirá o bug de qnd vc clica em qq botão na calculador o botao 1 é visualmente pressionado junto com os outros.

- o attibruto ID deve ser único na página pelo que vi vc esta usando id como se fosse uma classe então sugiro mudar de id="button" para class="button", e no css mude de #button para .button

Vamos a lógica...

O que você precisa fazer é armazenar o tipo da operação qnd o usuário clicar em algum botão de operação, então para isso é preciso criar um variável global chamada operador (ou qq outro nome que você quiser) para receber o tipo da operação que o usuário quer fazer. Logo você precisa criar uma função que jogue o valor do tipo da operação escolhida no click do botão para a var operador

Para passar automaticamente para o segundo campo, você precisa checar se o usuário já escolheu o tipo da operação. Então você precisará alterar a função preencher() para :
# Se a variável operador estiver vazia (usuário ainda nao escolheu a operação), então jogue os números no campo 1
# Caso contrário jogue no campo 2

Você precisará resetar a variável operador caso usuário clique no botão limpar, para que ao clicar e um número ele volte a ser inserido no botão 2

E por fim para evitar bugs no campo 1 você tem que se garantir que o usuário apenas possa gravar o tipo da operação caso ja tenha digitado algo no campo 1.. caso contrário não faça nada, ou seja, não armazene o tipo da operação caso não tenha nada no campo 1, o lugar para você fazer essa checagem é a função que você criou para armazenar o tipo da operação.

Parece muito mas qnd vc ver o código verá que é besteirinha msm...

Em anexo segue seu projeto alterado apenas para funcionar como previsto, não alterei a parte da semantica que eu citei no inicio do post..
Lógico da pra melhorar muito ainda a lógica .. mas só com isso sua calculadora já está funcional em todas as operações.

QQ coisa posta aee

[]'s

Valeu amigo consegui aqui!