1

   
function media(){
  var Media = (n1+n2)/2;
  document.write("<br> media:", Media);
}

var numero1 = document.querySelector("#number1");
var n1 = Number(numero1.value);

var numero2 = document.querySelector("#number2");
var n2 = Number(numero2.value);

var botao = document.querySelector("button");
botao.onclick = media; 
<meta charset="UFT-8">

<input type="number" name="numero1" id="number1">
<input type="number" name="numero2" id="number2">

<button>media</button>

3 Respostas 3

1

Bom, a chamada da função está vindo sem os parâmetors n1 e n2, porém mesmo assim resultaria em erro, pois a questão é que toda a vez que você clica no botão ele deve trazer os novos valores de number1 e number2 para n1 e n2 e isso não está acontecendo aqui.

Entçao para contornar essa situação criei uma arrowfunction e para que toda a vez que o botão é clicado ele busca o valor de number1 e number2, atribui em n1 e n2 e faz o cálculo da média atribuindo na variável média e por fim, sendo escrito no documento com document.write.

HTML

<input type="number" name="numero1" id="number1">
<input type="number" name="numero2" id="number2">
<button>media</button>

JAVASCRIPT

var numero1 = document.querySelector("#number1");
var numero2 = document.querySelector("#number2");

var botao = document.querySelector("button");

botao.onclick = () => {
  var n1 = Number(numero1.value);  
  var n2 = Number(numero2.value);
  
  var media = (n1 + n2) / 2;

  document.write("Média: " + media);
}

Teste o código em:

https://jsfiddle.net/veo9fj6y/

1

Vamos lá!

//Criação da função que receberá como parâmetros os valores dos seus botões
function media(num1, num2) {
  let mediaCalculada = (num1 + num2) / 2;
  document.write(" <br> media:", mediaCalculada);
}

//Atribuímos o seu elemento (seu botão) a uma variável
var botao = document.querySelector("#calcular-media");

//Aqui nós atribuímos um evento (o evento do clique) ao seu botão 
botao.onclick = function() {

  //Nessa duas linhas abaixo nós formatamos os valores que vem do value dos seus botões, pois eles vem como String,
  //...o que impossibilita de realizarmos a operação matemática. Por isso temos que formatar para inteiro.
  let n1 = parseInt(document.querySelector("#number1").value);
  let n2 = parseInt(document.querySelector("#number2").value);

  //Aqui nós passamos os parâmetros (que são os valores vindos dos seus botões) para a função e executamos ela.
  //Ou seja, quando clicamos no botão, executamos a função
  media(n1, n2);
}
<!-- Esses dois botões abaixo não precisam ser do tipo number -->
<!-- Eles podem ser do tipo text, por exemplo -->
<input type="number" id="number1">
<input type="number" id="number2">

<!-- Botão que ativa o evento click -->
<button id="calcular-media">Média</button>

0

Faça assim em seu HTML:

<meta charset="UFT-8">

<input type="number" name="numero1" id="number1">

<input type="number" name="numero2" id="number2">

<button onclick="media()"></button>

Em seu javascript:

function media(){
  let n1 = document.getElementById("number1").value;
  let n2 = document.getElementById("number2").value;
  let media = (n1+n2)/2;
  alert(media);
}

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .