如何比较javascript中的多个选择选项

Question

我有多个选择选项，我需要在每个选项之间进行比较。我怎么能在 jquery/javascript 中做到这一点？

在下面的示例中，我尝试选择单个选项，例如“temp”并且它有效。但是当我尝试同时选择“temp”和“level”时出现了两个弹出警报，这不是所需的输出。

for (var i = 0; i < sensor.length; i++) {
  var isSelected = sensor[i];
}


if (process1 === "P1" && isSelected === "temp") {
  alert("temp")
}
if (process1 === "P1" && isSelected === "hum") {
  alert("hum")
}
if (process1 === "P1" && isSelected === "pre") {
  alert("pre")
}
if (process1 === "P1" && isSelected === "level") {
  alert("level")
}
if (process1 == "P1" && isSelected == "temp" || isSelected == "level") {
  alert("level 14")
}

});

<div class="form-group col-md-6">
  <select class="selectpicker" id="sensor" name="sensor[]" multiple>
    <option selected>None</option>
    <option value="P1All">All</option>
    <option value="temp">Temperature</option>
    <option value="hum">Humidity</option>
    <option value="pre">Presure</option>
    <option value="level">Level</option>
  </select>

我期望的输出是：如果我选择“temp”和“level”，我应该得到一个仅显示“level 14”的弹出窗口。目前有两个弹出窗口，分别是“level”和“level 14”

Answer 1

您按顺序使用了许多 if 语句。所以当process1 === "P1" && isSelected === "level"和process1 == "P1" && isSelected == "temp" || isSelected == "level"这两个条件都为真时，都会抛出一个警报。

如果您希望其中只有一个运行，请改用 else if 语句。

例子：

if (process1 === "P1" && isSelected === "temp") {
  alert("temp")

} else if (process1 === "P1" && isSelected === "hum") {
  alert("hum")

} else if (process1 === "P1" && isSelected === "pre") {
  alert("pre")

} else if (process1 === "P1" && isSelected === "level") {
  alert("level")

} else if (process1 == "P1" && isSelected == "temp" || isSelected == "level") {
  alert("level 14")
}

有关 JavaScript 中条件语句的更多信息，请访问here。

Answer 2

解决方案：

您始终将最后一个数组元素存储在 isSelected 中。这可能是只收到 level 和 level 14 警报消息的原因。

for (var i = 0; i < sensor.length; i++) {
  var isSelected = sensor[i];
  if (process1 === "P1" && isSelected === "temp") alert("temp")
  if (process1 === "P1" && isSelected === "hum") alert("hum")
  if (process1 === "P1" && isSelected === "pre") alert("pre")
  if (process1 === "P1" && isSelected === "level") alert("level")
  if (process1 == "P1" && isSelected == "temp" || isSelected == "level") alert("level 14")
}

Answer 3

如果看到您启用了 jquery。

只需执行此操作即可获取选定的值：

var values = $('#sensor').val();
// values is now an array of string

然后你可以这样做：

if (process1 === "P1") {

  if (values.indexOf("temp") > -1 && values.indexOf("level") > -1) {
    alert("level 14");
  }
  else if (values.indexOf("temp") > -1) {
    alert("temp");
  }
  else if (values.indexOf("hum") > -1) {
    alert("hum");
  }
  else if (values.indexOf("pre") > -1) {
    alert("pre");
  }
  else if (values.indexOf("level") > -1) {
    alert("level");
  }
  else {
    alert('anything else');
  }
}

如果达到第一个 if（同时具有两个条件），则另一个 if 将被忽略。

必须进行一些调整，但你明白了。