jQuery自动选择选择选项问题时选项不可用答案

【问题标题】：Jquery auto selecting select option problem when option not availablejQuery自动选择选择选项问题时选项不可用
【发布时间】：2020-10-07 14:21:10
【问题描述】：

问题可能表明这里是 Jquery 的新手..

我有 2 个选择，它们的数字选项是由 php 生成的，这两个范围通常是不同的，例如第一个是 0-7，第二个是 0-4。

当用户在第一次选择中选择一个数字时，我需要在第二次选择中自动选择该值，我使用下面的代码来做到这一点。

问题是，当该选项在第二个选择中不可用时，例如5、6或7，什么都不会被选择，这不是问题，但是它似乎破坏了一些东西，因为在这种情况下，表单无法提交，什么也没有发生。

因此，我试图想出一个解决方案，让 Jquery 检测到该选项不可用并选择 0，而不是什么都没有。

感谢您的任何建议。

    $(document).ready(function () {
    $("#select1").change(function () {
    var list1 = $(this).val();
    $('#select2').val(list1).change();
     });

【问题讨论】：

标签： jquery select

【解决方案1】：

您可以使用length检查第二个选择是否包含具有第一个选择的选定选项值的选项：

$(document).ready(function() {
  $("#select1").change(function() {
    var list1 = $(this).val();
    if ($("#select2 option[value='" + list1 + "']").length > 0) {
      $("#select2").val(list1).change();
    } else {
      $("#select2").val("0").change();
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="select1">
  <option value="0">0</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>
<select id="select2">
  <option value="0">0</option>
  <option value="1">1</option>
  <option value="2">2</option>
</select>

【讨论】：