Javascript Jquery模式+使用选择的默认选项卡

现在，我有一个锚链接，点击它会打开一个模态窗口。在模态窗口中，我有两个选项卡

单击链接时，会打开模式并显示选项卡

代码如下：

<a href="#"  data-reveal-id="myModal" data-animation="fade" >Weekly Schedule</a>

这是带有选项卡的模式窗口：

<div id="myModal" class="reveal-modal">
<a class="close-reveal-modal">&#215;</a>

<div id="tabs">
  <ul>
    <li><a href="#tabs-1">Schedule 1</a></li>
    <li><a href="#tabs-2">Schedule 2</a></li>

  </ul>
  <div id="tabs-1">
Schedule 1 content
</div>

<div id="tabs-2">
Schedule 1 content
</div>

</div>
</div>

以下是JSFIDLE：

它工作得很好。但现在我想将锚点链接更改为选择下拉。因此，每当用户更改选项时。模式窗口打开，所选选项选项卡默认打开

像这样：

<select name="schedule">
<option value="">Please Select schedule </option>
<option value="0">Schedule 1 </option>
<option value="1">Schedule 2</option>
</select>

因此，选择选项1将打开模态窗口，其中默认打开选项卡1。同样地，选择tab 2将打开模态，其中tab 2作为默认打开

我如何做到这一点

艾哈迈尔

感谢这一点：

选择框更改时，选项卡也会更改。以下是JSFIDLE：

我认为你自己能处理好淡出/淡出的问题

$('#schedule').on('change',function(e){
    console.log($(this).val());
   $( "#tabs" ).tabs("select",$(this).val());
})