代码之家 › 专栏 › 技术社区 › Suzdar Ibrahim

if语句的输出错误

boolean parameters if-statement javascript

Suzdar Ibrahim · 技术社区 · 8 年前

window.onload = start;


function start() {

  document.getElementById("kalk").onclick = find;
  find(1, 9999);
}

function find(min, max) {
  var factor = document.getElementById("tall").value;
  var factor2 = document.getElementById("tall2").value;

  var x = factor * factor2;

  document.getElementById("utskrift").innerHTML = x;

  if (x >= min && x <= max) {
    document.getElementById("msg").innerHTML = "Number is in interval."
  } else {
    document.getElementById("msg").innerHTML = "Number is not in interval."
  }
}

<h2>Gang to tall</h2>

T1 <input type="number" id="tall" /> T2 <input type="number" id="tall2" />

<button id="kalk">Finn tall i intervall</button> Sum: <span id="utskrift"></span>

<p id="msg"></p>

因此,通过阅读此代码。。我要做的是有两个输入,我把输入的数字相乘。在我的“Find()”参数中,有两个参数表示数字应该在1-9999之间。在我的“函数find”中,我调用了这些参数min和max。进一步往下看代码,我询问输出是否在这些数字之间,是否在min和max之间,给出“数字在区间内”。问题是,即使这些参数中有数字,我也会得到else语句。是否有任何方法来修复此问题或在参数中输入感觉?

谢谢

2 回复 | 直到 8 年前

ibrahim mahrir 8 年前

您正在附加功能 find 直接发送到click事件侦听器。函数需要两个参数 min 和 max :

function find(min, max)

但是,当单击发生时,作为事件侦听器,它只接收一个参数,即事件对象。因此 最小值 将成为事件对象,并且 最大值 undefined 还有你的 if 声明行不通。你可以通过登录来查看 最小值 和在…内 发现 到控制台。

包装函数 发现

document.getElementById("kalk").onclick = function(event) { // the event listener function recieves the event object as the only parameter (not that argument event here is not necessary, I just added it for explanation)
   find(1, 90000);                                          // when this function get executed (when a click happens) then call find with proper parameters
}

Scott Marcus 8 年前

首先,你必须记住HTML中的“T”代表“text”。HTML中只有一种数据类型。。。串。当您从HTML中获取一个值并希望在JavaScript中将其用作数字时,必须将其转换为数字。

其次,你没有真正正确地组织你的功能。 find 不应该在页面加载后立即运行。您希望它在单击按钮时运行。那样的话 min 和 max 值在您需要时传递。

最后,当您实际上在计算乘积时,您静态地说“Sum”。

<html>

<head>

</head>

<body>
  <h2>Gang to tall</h2>

T1 <input type="number" id="tall"/>
T2 <input type="number" id="tall2"/>

<button id="kalk">Finn tall i intervall</button>

Product: <span id="utskrift"></span>

<p id="msg"></p>

<!-- It's a good idea to place your scripts just before the closing
     body tag. That way, the HTML has been loaded by the time the
     JavaScript runs. -->
<script>
  document.getElementById("kalk").onclick = result;
  
  // Get your DOM references just once so you don't have to re-scan the DOM
  // for them every time the button is clicked. 
  
  // Also, just reference the elements themselves, not properties (.value) of
  // the element because if you just reference the property and later decide 
  // you need some other property, you'll have to re-scan the DOM for the same
  // element again. This way, you maintain a reference to the element and can
  // get any property you need at any time.
  var factor = document.getElementById("tall");
  var factor2 = document.getElementById("tall2");  
  var product = document.getElementById("utskrift");
  var msg = document.getElementById("msg");

  function find(min,max){
    // All values coming from HTML are strings. You should always 
    // explicitly convert them to numbers when numbers are expected.
    var x = parseInt(factor.value, 10) * parseInt(factor2.value,10);

    // .innerHTML is for when you are assigning a string that contains HTML.
    // It tells the HTML parser to parse the string for HTML. If you are not
    // including HTML, use .textContent, which doesn't do this extra parsing.
    product.textContent = x;
    if (x >= min && x <= max) {
      msg.textContent = "Number is in interval."
    } else {
      msg.textContent = "Number is not in interval."
    }
}

function result(){
  find(1, 9999);
}

</script>
</body>
</html>