通过简单的html下拉菜单导航jQuery图像滑块

Question

嗨，我正在尝试创建一个基本的下拉菜单，允许用户导航到jQuery滑块中的特定幻灯片。这个滑块脚本提供了公共方法"gotoSlide（index）"，因此可以通过onClick="jQuery('.slider').Slider().gotoSlide(1); return false;"跳转到特定的幻灯片。我想把这个链接集成到一个基本的HTML下拉菜单形式中，即

<form name="jumpTo">
    <select name="menu" onChange="...">
    <option value= onClick="jQuery('.slider').Slider().gotoSlide(1); return false;">LINK 1</option>
    <option>...</option>
    </select>
</form>

我假设我的语法不正确，似乎我需要在"onChange"属性中添加适当的JS来启用滑块内的导航（？），但我不确定如何继续。我见过onChange="window.location=this.options[this.selectedIndex].value;"，它似乎适用于常规链接，但不适用于点击事件。

感谢您的指导。

Answer 1

使用选择框的change()事件。。。获取更改后的selectbox的值，并类似调用函数gotoSlide()

试试这个

HTML

<form name="jumpTo">
  <select name="menu" id="selectmenu"> //added an id here
    <option value="1">LINK 1</option> //changed the value to the slider you want to go to
   <option value="2">LINK 2</option>....
 </select>
</form>

查询

$('#selectmenu').change(function(){  //calling change event
     jQuery('.slider').Slider().gotoSlide($(this).val());  //go to slide with the changed value
     return false;
 });