Question

我的JS代码有小问题。我想根据要放入表格中的值进行计算。我有两种形式：一种是胜利者，另一种是宽松的。基于此，我以秒为单位计算获胜者和获胜者的时间。在以秒为单位获得两个值之后，我需要计算第三个值。这是我的问题。我的JS返回NaN：/我被困住了，需要其他意见。感谢您的帮助

function calcWinner() {
  // vars
  const h = parseInt(document.querySelector('#h-winner').value);
  const m = parseInt(document.querySelector('#m-winner').value);
  const s = parseInt(document.querySelector('#s-winner').value);

  const hMin = h * 60;
  const mMin = (m + hMin) *60;
  const sSec = mMin + s;
  winner = sSec;

  console.log(winner +' winner score');
  return winner;
};

function calcLooser() {
  // vars
  const h = parseInt(document.querySelector('#h-looser').value);
  const m = parseInt(document.querySelector('#m-looser').value);
  const s = parseInt(document.querySelector('#s-looser').value);

  const hMin = h * 60;
  const mMin = (m + hMin) *60;
  const sSec = mMin + s;
  looser = sSec;

  console.log(looser + ' looser score');
  return looser;
};

function radioCheck(winner, looser){
  // vars
  const radioMega = document.querySelector('#mega').checked;
  const radioMini = document.querySelector('#mini').checked;
  // let sector;
  // check distance
  if (radioMega === true){
      sector = winner / looser;
  }else if (radioMini === true){
      sector = (winner / looser) * 0.920;
  }else{
      alert('error')
  }
  console.log(sector);
};

<form class="time">
    <input type="number" class="input-time" id="h-winner"placeholder="h"> 
    <input type="number" class="input-time" id="m-winner"placeholder="min">
    <input type="number" class="input-time" id="s-winner"placeholder="s">
</form>
<form class="time">
    <input type="number" class="input-time" id="h-looser" placeholder="h">
    <input type="number" class="input-time" id="m-looser" placeholder="min">
    <input type="number" class="input-time" id="s-looser" placeholder="s">
</form>
<div class="btn-radio">
    <input type="radio" name="distance" id="mega" class="btn-radio__input mg">
    <span class="radio-text">Mega/Giga</span>
    <input type="radio" name="distance" id="mini" class="btn-radio__input mi">
    <span class="radio-text">Mini</span>
</div>

enter image description here

document.querySelector('.btn-oblicz').addEventListener('click', calcSektor);
function calcSektor(){
calcWinner();
calcLooser();
radioCheck();}

Answer 1

要获得预期结果，请将获胜者和失败者的值传递给radioCheck函数，因为它们是预期参数

    document.querySelector('.btn-oblicz').addEventListener('click', calcSektor);

   function calcSektor(){
      let winner = calcWinner();
      let looser = calcLooser();
      radioCheck(winner, looser);
    }

codepen-https://codepen.io/nagasai/pen/aQQxaE

function calcWinner() {
  // vars
  const h = parseInt(document.querySelector("#h-winner").value);
  const m = parseInt(document.querySelector("#m-winner").value);
  const s = parseInt(document.querySelector("#s-winner").value);

  const hMin = h * 60;
  const mMin = (m + hMin) * 60;
  const sSec = mMin + s;
  winner = sSec;

  console.log(winner + " winner score");
  return winner;
}

function calcLooser() {
  // vars
  const h = parseInt(document.querySelector("#h-looser").value);
  const m = parseInt(document.querySelector("#m-looser").value);
  const s = parseInt(document.querySelector("#s-looser").value);

  const hMin = h * 60;
  const mMin = (m + hMin) * 60;
  const sSec = mMin + s;
  looser = sSec;

  console.log(looser + " looser score");
  return looser;
}

function radioCheck(winner, looser) {
  // vars
  const radioMega = document.querySelector("#mega").checked;
  const radioMini = document.querySelector("#mini").checked;
  // let sector;
  // check distance
  if (radioMega === true) {
    sector = winner / looser;
  } else if (radioMini === true) {
    sector = winner / looser * 0.92;
  } else {
    alert("error");
  }
  console.log(sector);
}

document.querySelector(".btn-oblicz").addEventListener("click", calcSektor);
function calcSektor() {
  let winner = calcWinner();
  let looser = calcLooser();
  radioCheck(winner, looser);
}

<form class="time">
    <input type="number" class="input-time" id="h-winner"placeholder="h"> 
    <input type="number" class="input-time" id="m-winner"placeholder="min">
    <input type="number" class="input-time" id="s-winner"placeholder="s">
</form>
<form class="time">
    <input type="number" class="input-time" id="h-looser" placeholder="h">
    <input type="number" class="input-time" id="m-looser" placeholder="min">
    <input type="number" class="input-time" id="s-looser" placeholder="s">
</form>
<div class="btn-radio">
    <input type="radio" name="distance" id="mega" class="btn-radio__input mg">
    <span class="radio-text">Mega/Giga</span>
    <input type="radio" name="distance" id="mini" class="btn-radio__input mi">
    <span class="radio-text">Mini</span>
</div>

<button class="btn-oblicz" >Check Winner</button>

JavaScript添加两个值时返回NaN

1 个答案: