Question

我尝试创建一个名为temp（）的开关函数，它应该允许在插入值后显示定义。目前这根本不起作用，我无法理解为什么

function temp() {
    var x = parseInt(document.getElementById('temp').value);
    var y = document.getElementById('temp1');
    switch (x) {
        case x < 36:
            y = hypothermia;
            break;
        case x > 37:
            y = hyperthermia;
            break;
        case x > 38,5:
            y = pyrexia;
            break;
        default:
            y.style.display = 'none';
    }
}

我还尝试使用＆＃34; if ... else if ...＆＃34;方法，但只有前两种情况真的有效，而其余的只是被忽略了（我已经尝试过切换顺序）。

function temp() {
    var x = parseInt(document.getElementById('temp').value);
    var y = (document.getElementById('temp1'));
    if (x < 36) y.style.background = "yellow",y.style.color = "blue",y.innerHTML = "hypothermia";
    else if (x < 37) y.style.display = "none";
    else if (x > 37) y.style.background = "yellow",y.style.color = "black",y.innerHTML = "hyperthermia";
    else if (x > 38) y.style.background = "red",y.style.color = "black",y.innerHTML = "pyrexia";
}

功能应该起作用的HTML页面是：

<table> <tr> <td>TEMPERATURA (°C)</td> <td><input type="text" style="font-size:100%" maxlength="4" size="4" id="temp"></td> <td><h3 id="temp1"></h3></td> </tr> </table>

Answer 1

使用if-else if，只有第一个evals为true的条件才会被调用

来自https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if...else

可以嵌套多个if ... else语句来创建else if子句。请注意，JavaScript中没有elseif（单词）关键字。

accessNotConfigured

要了解它是如何工作的，这就是嵌套正确缩进时的样子：

if (condition1)
   statement1
else if (condition2)
   statement2
else if (condition3)
   statement3
...
else
   statementN

我个人会尝试一种完全不同的方法 - https://jsfiddle.net/denov/9awt48bo/4/

Answer 2

如果您将功能更改为此功能，则可以正常工作。

从parseInt更改为parseFloat，以便x > 38.5可以验证
交换验证订单，从最高位置开始，否则它将始终打破x > 37高于37的值并且永远不会点击x > 38.5
为了能够使用表达式，您需要将开关设置为switch (true)

＆＃13;

function temp() {
  var x = parseFloat(document.getElementById('temp').value.replace(',','.'));
  var y = document.getElementById('temp1');
  y.style.display = 'block';
  switch (true) {
    case x > 38.5:                  /*  comma, changed to dot  */
      y.innerHTML = "pyrexia";      /*  assing to inner HTML   */
      break;
    case x > 37:
      y.innerHTML = "normal";
      break;
    case x < 36:
      y.innerHTML = "hypothermia";
      break;
    default:
      y.style.display = 'none';
  }
}
document.querySelector('input').addEventListener('input', temp);

＆＃13;

<table>
  <tr>
    <td>TEMPERATURA (°C)</td>
    <td><input type="text" style="font-size:100%" maxlength="4" size="4" id="temp"></td> <td><h3 id="temp1"></h3></td>
  </tr>
</table>

＆＃13;

if else版

＆＃13;

function temp() {
  var x = parseFloat(document.getElementById('temp').value.replace(',','.'));
  var y = document.getElementById('temp1');
  y.style.display = 'block';
  if (x > 38.5) {
      y.innerHTML = "pyrexia";
  } else if (x > 37) {
      y.innerHTML = "normal";
  } else if (x < 36) {
      y.innerHTML = "hypothermia";
  } else {
      y.style.display = 'none';
  }
}

document.querySelector('input').addEventListener('input', temp);

＆＃13;

<table>
  <tr>
    <td>TEMPERATURA (°C)</td>
    <td><input type="text" style="font-size:100%" maxlength="4" size="4" id="temp"></td> <td><h3 id="temp1"></h3></td>
  </tr>
</table>

＆＃13;

切换min - max元素

2 个答案: