首页 > 解决方案 > JavaScript if 和 else if 语句无法正常工作

问题描述

我有一个input type='number'和一个按钮来指示function testfun()函数中的 if 语句,它应该验证数字是否在范围内并提供明确的说明。

当我输入 1-1000 范围内的数字时,它工作正常。

当我输入一个 <1 或 >1000 的数字时,<div><p>不会填充。

HTML:

<div class="preT" id="preT">
  <form>
    <label for="voipLines">VoIP Lines</label>
    <input type="number" id="voipLines" name="voipLines" requiered min="1" max="1000" value="1">
  </form>
  <div class="voipbutton" id="voipbutton">
    <button class="button" onclick="testfun()">Test Clicker</button>
  </div>
</div>
<div id="duringT">
  <p Id="clickerTest"></p>
  <div Id="prBar" data-label=""></div>
  <div id="canvascon"></div>
</div>

JS:

function testfun() { //used in HTML
  var voip = document.getElementById("voipLines").value;
  if (voip < 1) { //voiplines verification 
    return document.getElementById("clickerTest").innerHTML = "<div><p>Make Sure VoIP Lines is within the range of 1 to 1000</p></div>";
  } else if (voip > 1000) {
    return document.getElementById("clickerTest").innerHTML = "<div><p>Make Sure VoIP Lines is within the range of 1 to 1000</p></div>";
  } else {
    var voipGuide = document.getElementById("clickerTest").innerHTML = '<h2>Clicker Successful!!!</h2>\
    <p>Please click the link below to start <b>' + voip + ' test</b></p>\
    <p>To change the amount of tests to run <a href= "">Click Here</a></p>';
  document.getElementById('preT').style.display = 'none';
    document.getElementById("canvascon").innerHTML = '<div id="canvas-container"><canvas id="canvs3" style="background-color:#F0F0F0; ">Your browser does not support the HTML5 canvas tag.</canvas><br><br></div>';
    voipsims();
    bootfun();
  }
}

标签: javascripthtmlformsif-statementverification

解决方案


在 else 正文中,您使用的是 innerHTML,但在 if 和 else 中,您使用的是 innerhtml。它应该是innerHTML


推荐阅读