Javascript jQuery Mobile：禁用其他选择菜单中的选定选项

我的jQuery手机页面上有三个选择菜单。如果用户选择了一个选项，我希望在其他选择菜单中禁用该选项

到目前为止，我已经成功地在select元素中禁用了该选项，但没有在options弹出窗口中禁用。用户仍然可以在弹出窗口中选择一个选项，但我想防止出现这种情况

我的小提琴来了：

我的代码：

HTML:

---

在您的手机上尝试此操作，它会使选项在物理上不可选择（但不可见）

解决方案：

---

重建选择菜单是必要的，因为它是jQuery Mobile。

请仔细阅读我的文章。我已经设法用我提供的代码使选项在物理上不可选择，但不可见。我找到了解决方案：$（'select'）。selectmenu（'refresh'，true）@马克斯试了很多，但我没有想到这件事。请张贴你的答案。而且，由于jQuery Mobile上存在此实现，是否需要刷新？@Max ah my bad。还有一件事，使用$（'.filter menu'）而不是$（'select.filter menu'）返回不需要的跨度元素（注意小提琴中的这一点）

<div data-role="page" id="page1">
    <div data-role="header">
         <h1>My page</h1> 
    </div>
    <div role="main" class="ui-content">
        <form>
            <select class="filter-menu" data-native-menu="false">
               <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>
            </select>

            <select class="filter-menu" data-native-menu="false">
               <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>
            </select>

            <select class="filter-menu" data-native-menu="false">
               <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>
            </select>
        </form>
    </div>
</div>

$('.filter-menu').on('change', function() {
  var $changedSelect = $(this);
  var selectedId = $(this).val();

  $('.filter-menu').not($changedSelect).each(function() {
      $(this).find('option[value=' + selectedId + ']').attr('disabled', 'disabled')
  });
});

$('select.filter-menu').not($changedSelect).each(function() {
    $(this).find('option[value="' + selectedId.toString() + '"]').prop('disabled', true);
});

$('.filter-menu').on('change', function () {
            $('.filter-menu').find('option').prop('disabled', false);

           $('.filter-menu').each(function () {
               $('.filter-menu').not(this).find('option[value="' + this.value + '"]').prop('disabled', true);
            });

            // rebuild select menus
            $('select').selectmenu('refresh', true);
});