Javascript 如何使用jQuery UI在模式对话框中重置selectmenu

我在jQuery模式对话框中有一个jQuery UI

selectmenu

。当模式对话框关闭时，无论是通过“确定”、“取消”按钮还是“关闭”框，我都想清除对

选择菜单的选择

我正在尝试更新一个我没有编写的web应用程序，以消除对jAlert/jConfirm/jPrompt库的使用，该库似乎已被撤销。在我拆开这个应用程序之前，我构建了一个我想使用的示例，我编写这个应用程序并不是为了替换许多jPrompt调用

我已经演示了我可以在模型对话框中显示
selectmenu
，并可以将选择返回到模态对话框，在那里我打算将其存储在需要的地方

到目前为止，我无法做到的是，当用户退出模式对话框时，通过单击“确定”或“取消”按钮或“关闭”框，从
选择菜单中清除选择。我试图应用我在这个网站上找到的大约六条建议，但在这种情况下这些建议都不起作用

我在这里包括了我的示例：

<button id="opener">Change Category</button>
<div id="popup_message" style="display: none;">
  <form id="category_popup">
    <select name="category" id="category">
      <option>Choose a category</option>
      <option value="G1">G1</option>
      <option value="G3">G3</option>
      <option value="C1G1">C1G1</option>
      <option value="C2G1">C2G1</option>
      <option value="C3G1">C3G1</option>
      <option value="C4G1">C4G1</option>
      <option value="C5G1">C5G1</option>
      <option value="C6G1">C6G1</option>
      <option value="C7G1">C7G1</option>
      <option value="C8G1">C8G1</option>
      <option value="C9G1">C9G1</option>
      <option value="C1G3">C1G3</option>
      <option value="C2G3">C2G3</option>
    </select>
  </form>
</div>
<script>
  $('#popup_message').dialog({
    autoOpen: false,
    modal: true,
    title: 'Choose Category',
    buttons: [{
        text: 'OK',
        click: function() {
          alert('Category= ' + $('#category').find(':selected').text());
          $(this).dialog('close');
          return $('#category').val();
        }
      },
      {
        text: 'Cancel',
        click: function() {
          $(this).dialog('close');
        }
      }
    ]
  });
  $('#opener').on('click', function() {
    $('#popup_message').dialog('open');
  });
  $('#popup_message').on('dialogclose', function() {
    // $('#category_popup option').attr('selected',false);
    // $('#category_popup').trigger('reset');
    $('#category').selectmenu('refresh');
    // $(':input','#category_popup').removeAttr('selected');
    // $('#category_popup').val([]);
    truth = true; // to allow a breakpoint here
  });
  $('#category').selectmenu();
</script>

更改类别
选择一个类别
G1
G3
C1G1
C2G1
C3G1
C4G1
C5G1
C6G1
C7G1
C8G1
C9G1
C1G3
C2G3
$（“#弹出消息”）。对话框({
自动打开：错误，
莫代尔：是的，
标题：“选择类别”，
按钮：[{
文本：“OK”，
单击：函数（）{
警报（'Category='+$（'#Category'）。查找（':selected'）。text（）；
$（this.dialog（'close'）；
返回$（'#category'）.val（）；
}
},
{
文本：“取消”，
单击：函数（）{
$（this.dialog（'close'）；
}
}
]
});
$（'#opener'）。在（'单击'，函数（）上）{
$（'弹出消息'）。对话框（'打开'）；
});
$（'popup#message'）。在（'dialogclose'，function（）上{
//$（'category_popup option'）.attr（'selected'，false）；
//$（“#类别(弹出窗口”）。触发器（'reset'）；
$（“#类别”）。选择菜单（“刷新”）；
//$（'：输入'，'#类别(弹出窗口'）。删除属性（'选定'）；
//$（'#类别弹出窗口'）.val（[]）；
truth=true；//此处允许断点
});
$（“#类别”）。选择菜单（）；
在执行以下操作之前，您需要更改索引：

$('#popup_message').on('dialogclose', function() {
  // $('#category_popup option').attr('selected',false);
  // $('#category_popup').trigger('reset');
  var myselect = $("select#category");
  myselect[0].selectedIndex = 0;
  myselect.selectmenu("refresh");
  // $(':input','#category_popup').removeAttr('selected');
  // $('#category_popup').val([]);
  truth = true; // to allow a breakpoint here
});

这就解决了。这就引出了一个问题：是否因为可能有多种选择，所以需要对其进行索引？感谢您快速而有益的回复