jQuery：if语句以选择一个选项值

Question

我的目标是：

1. 如果输入的值大于60，则希望选择选项“长”。
2. 如果输入的值小于60，则希望选择“短”选项。

借助于jQuery，我希望给定字段“值”的情况下“结果”会自动更改

我有一个表单，包含ID为“ value”的输入整数字段，表单具有ID为“ result”的选项字段。

下面是我的尝试，但是不起作用。

感谢您的输入。

var value = $('#value');
$(value).change(function() {
  debugger;
  if (Number($(this).val()) > 60) {
    $('#result').prop('value') = "Long";
  }
  if (Number($(this).val()) < 60) {
    $('#result').prop('value') = "Short";
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label for="value" class="col-form-label col-sm-4">Value</label>
<div class="col-sm-7"> <input type="number" name="value" class="numberinput form-control" id="value"> </div>
</div>
<div><i>Result:</i></div>
<div id="result" class="form-group row">
  <div class="col-sm-12">
    <select name="result" class="select2 form-control" style="width: 100%;" id="result">
      <option value="Long">Long</option>
      <option value="Short">Short</option>

Answer 1

您可以使用设置设定值.val(....)。

var value = $('#value');
$(value).change(function() {
  debugger;
  if (Number($(this).val()) > 60) {
    $('select').val("Long");
  }
  if (Number($(this).val()) < 60) {
    $('select').val("Short");
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label for="value" class="col-form-label col-sm-4">Value</label>
<div class="col-sm-7"> <input type="number" name="value" class="numberinput form-control" id="value"> </div>
</div>
<div><i>Result:</i></div>
<div id="result" class="form-group row">
  <div class="col-sm-12">
    <select name="result" class="select2 form-control" style="width: 100%;" id="result">
      <option value="Long">Long</option>
      <option value="Short">Short</option>

除此之外，HTML中还存在一些问题，您result多次使用了相同的ID（）。ID是唯一的。

如@Archer所述，如果值为，则两个当前条件均不匹配60，您将需要进行“ >=或” <=比较以解决这些情况。