Função Calcular Salário - JavaScript
16/04/2013
0
Primeiramente gostaria de dizer que sou novo no fórum e estou estudando JavaScript. Já estudei bastante HTML e também CSS, mas JavaScript eu nunca tinha usado. Como sei que é algo importante, estou me esforçando pra aprender agora.
Agora ao problema: estou criando aqui uma função para calcular o salário de um funcionário com base no valor da hora e na quantidade de horas trabalhadas. Ou seja, o salário vai ser igual ao produto do valor da hora e da quantidade de horas trabalhadas:
Salario = Valor da Hora X Quantidade de Horas Trabalhadas
Criei uma função chamada calculaSalario, que pega os valores de dois inputs, calcula o salário e mostra uma mensagem com o resultado. Só que ao clicar no botão, a mensagem não está sendo exibida.
Pelo que vi, é pra botar o nome da função no atributo onclick e o alert é a função para exibir mensagens, mas aqui não está funcionando. Se alguém tiver uma ideia do que seja, eu agradeço.
Obrigado desde já.
Carlos Andriê
Posts
16/04/2013
William
16/04/2013
Carlos Andriê
O HTML consiste basicamente de um fieldset com alguns inputs e um button que chama a função:
<fieldset> <legend>Cálculo do salário</legend> <label>Valor da hora:</label> <input id="valor" type="text"/> <label>Quantidade de horas trabalhadas:</label> <input id="quantidade" type="text"/> <button id="calcular" onclick="calculaSalario">Calcular salário</button> </fieldset>
16/04/2013
Carlos Andriê
A função é essa:
<script type="text/javascript">
function calculaSalario(){
var valor = document.getElementById("valor");
var quantidade = document.getElementById("quantidade");
var salario = valor*quantidade;
alert(salario);
}
</script>Se eu botar só alert('teste') dentro do onclick funciona.
16/04/2013
Joel Rodrigues
Cara, reparei duas coisas "faltando" no seu código:
1) Quando você define as variáveis valor e quantidade, você passa para elas o resultado da função getElementById. Porém, essa função vai te retornar, na verdade, os inputs e não os valores dentro deles. O que você precisa aí é da propriedade value dos inputs, ou seja, falta colocar .value após o parêntese (antes do ponto-e-vírgula).
2) Na tag button, ao chamar a função calculaSalario, faltou colocar os parênteses após o nome, indicando que é uma função.
16/04/2013
Joel Rodrigues
<!DOCTYPE html>
<html>
<head>
<title>Cálculo de salário</title>
<meta charset="UTF-8" />
<script type="text/javascript">
function calculaSalario(){
var valor = document.getElementById("valor").value;
var quantidade = document.getElementById("quantidade").value;
var salario = valor*quantidade;
alert(salario);
}
</script>
</head>
<body>
<fieldset>
<legend>Cálculo do salário</legend>
<label>Valor da hora:</label>
<input id="valor" type="text"/>
<label>Quantidade de horas trabalhadas:</label>
<input id="quantidade" type="text"/>
<button id="calcular" onclick="calculaSalario()">Calcular salário</button>
</fieldset>
</body>
</html>Boa sorte.
16/04/2013
Carlos Andriê
Dessas dicas eu não esqueço mais.
Obrigado a todos.
16/04/2013
Roniere Almeida
Cara, reparei duas coisas "faltando" no seu código:
1) Quando você define as variáveis valor e quantidade, você passa para elas o resultado da função getElementById. Porém, essa função vai te retornar, na verdade, os inputs e não os valores dentro deles. O que você precisa aí é da propriedade value dos inputs, ou seja, falta colocar .value após o parêntese (antes do ponto-e-vírgula).
2) Na tag button, ao chamar a função calculaSalario, faltou colocar os parênteses após o nome, indicando que é uma função.
estava no meio do caminho, hehehehe.
16/04/2013
Joel Rodrigues
Já que o problema foi resolvido, estou fechando o tópico.
Abraço a todos.
Clique aqui para fazer login e interagir na Comunidade :)
