如何检查 jquery IF 语句中的多个值

Question

我有下面的代码 shows/hides a div 基于下拉列表中的一个选项，但是它只在用户选择 1 时切换。我的下拉列表中有几个项目倒是想秀一下 DIV 作。例如，假设我的下拉列表中有值 1 到 8，我想在用户选择 4、6 和 7 时显示 DIV。我不希望 DIV如果用户将选择从 4 更改为 6，则关闭并隐藏。

    $(document).ready(function(){
    $('#TypeofAction').on('change', function() {
      if ( this.value == '1') 
      //.....................^.......
      {
        $("#business").show();
      }
      else
      {
        $("#business").hide();
      }
    });
        
});

Answer 1

您可以使用 switch() 或者您可以用完全不同的方式编写 if/else.. 但这里是：

switch (this.value) {
  case '1':
  case '4':
  case '6':
  case '7':
    $("#business").show();
    break;
  case '2':
    $("#business").hide();
    break;
  case '3':
    console.log('do something else..');
    break;
  default:
    console.log('Invalid selection..');
}

更多信息在这里：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch

您也可以使用多个 if 条件：

if ( this.value == 1 || this.value == 4 || this.value == 6 || this.value == 7 ) {
...
}elseif( this.value == 2 || this.value == 3 ){
...
}else{
...
}

或者您可以将有效值添加到数组中，然后使用 indexOf()

检查

if ([1,4,6,7].indexOf(this.value) > -1){
...
}

或将indexOf()替换为includes():

if ([1,4,6,7].includes(this.value)){
...
}

Answer 2

使用数组存储“On”值并检查是否使用 jquery 的 toggle 中的布尔显示变量：

$(document).ready(function() {
  $('#TypeofAction').on('change', function() {
    let onVals = ["4", "6", "7"];
    $("#business").toggle(onVals.includes(this.value));
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="TypeofAction">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<div id="business">It's busness time!</div>

如何检查 jquery IF 语句中的多个值

How to check for multiple values in a jquery IF statement

javascript

jquery