jQuery:如何通过单击图像来打开/关闭下拉菜单？

Question

我想通过单击图像来打开和关闭下拉菜单。下面是我的 html。

<a href="javascript:void(0);" class="select_button1"><img alt="" src="images/button.gif" /></a>
<select class="select1">
      <option name="test" value="" class="first">Select</option>
      <option name="test" value="" class="">Opt1</option>
      <option name="test" value="" class="">Opt2</option>
</select>

这是我尝试过的方法，但似乎不起作用:

$(document).ready(function() {
  $('select_button1').click(function() {
   $('.select1').toggle();
  });
});

Answer 1

编辑:

正如 techfoobar 提到的，显然这是不可能的。您可以做的就是保持选择元素不断扩展并在单击时隐藏/显示它。

HTML:

<a href="javascript:void(0);" class="select_button1"><img alt="" src="images/button.gif" /></a>
<br/>
<select class="select1" size="5" style="display:none">        
    <option name="test" value="" class="first">Select</option>       
    <option name="test" value="" class="">Opt1</option>       
    <option name="test" value="" class="">Opt2</option>
</select>

JS:

$('.select_button1').click(function() {
    $('.select1').toggle();
});

http://jsfiddle.net/WYm4H/4/