Jquery 选择框显示隐藏

我对selectbox div show hide有疑问。。。 首先，这是我的来源

HTML：

<Select id="colorselector">
   <option value="red">Red</option>
   <option value="yellow">Yellow</option>
   <option value="blue">Blue</option>
</Select>
<a href="#"><span>Go</span></a>
<div id="red" class="colors" style="display:none"> red... </div>
<div id="yellow" class="colors" style="display:none"> yellow.. </div>
<div id="blue" class="colors" style="display:none"> blue.. </div>

$(function() {
    $('#colorselector').change(function(){
        $('.colors').hide();
        $('#' + $(this).val()).show();
    });
});

演示：

当我选择红色时，红色Div显示。。。但是我想换成。。。添加Go按钮。

---

但是很难做到。。。有人能帮我吗？

这就是你的想法吗

 $(function() {
        $('a').click(function(){
            $('.colors').hide();
            $('#' + $('#colorselector').val()).show();
        });
    });

---

我的答案与上面的答案几乎相同，但是我会在触发事件的href上放置一个类或id，以及.on（）方法，因为.click现在已被弃用。click（）只需运行一个函数到.on（），基本上就是调用.on（）到.click（），您可以直接调用.on（）。.on（）的另一个优点是，通过执行以下操作，您可以轻松地将多个事件侦听器类型绑定到单个选择器：

$(something).on('click, mouseover', function() { // whatever });

$(function() {

     $('a[href="#"]').on('click', function() {
          $('.colors').hide();
          $('#'+ $('#colorselector').val()).show();
     });
});

---

请在问题本身中包含解决问题所需的最低代码量。链接到代码没有帮助，因为链接会消失。一旦发生这种情况，这对未来的访客来说就没用了