Javascript “转换后”；选择"；下拉列表淹没，div显示/隐藏停止工作

我想要的不是“选择”类型的下拉列表，而是ul。但是，在转换到ul之后，我的javascript没有启动，我也不知道为什么。这是一个很好的选择…我错过了什么吗

这是原始选择（工作）

排序方式：
现在在线
最低价优先
最佳评级第一

这是ul版本：（不工作）

下面是javascript：

<script type="text/javascript"> 
$(document).ready(function() {

  $('#Online-holder').show();
  $('#Online-link').click(function() {
    $('#Online').toggle(400);
    return false;
  });


  $('#Lowest-holder').hide();
  $('#Lowest-link').click(function() {
    $('#Lowest').toggle(400);
    return false;
  });


  $('#Alpha-holder').hide();
  $('#Alpha-link').click(function() {
    $('#Alpha').toggle(400);
    return false;
  });

});

jQuery("#selector1").change(function(){
    var div = jQuery(this).val();
    $('.holder').hide(200);
    jQuery(div).show(200);
});
</script>

$（文档）.ready（函数（）{
$（“#在线持有者”）.show（）；
$（“#联机链接”）。单击（函数（）{
$（“#在线”）。切换（400）；
返回false；
});
$（“#最低持有者”）.hide（）；
$（“#最低链接”）。单击（函数（）{
$（'最低'）。切换（400）；
返回false；
});
$（'#Alpha holder'）.hide（）；
$（“#Alpha链接”）。单击（函数（）{
$（'#Alpha'）。切换（400）；
返回false；
});
});
jQuery（“#selector1”）.change（函数（）{
var div=jQuery（this.val（）；
$（'.holder'）。隐藏（200）；
jQuery（div.show）（200）；
});

---

救命啊！谢谢大家!

由于您的元素变成了可单击的元素而不是可选择的元素，因此您可以将

change

功能更改为

click

功能，如下所示：

jQuery("#selector1 li").click(function(){
  var div = jQuery("a", this).attr("value");
  $('.holder').hide(200);
  jQuery(div).show(200);
});

---

UL没有

更改

事件，通常不会更改，除非您以编程方式更改它。你不能仅仅用UL替换select并期望它以同样的方式工作，一个是接受用户操作的交互式元素，另一个只是一个静态无序列表。好吧，这很有意义：）难怪我会这么做。我会找到另一种方法…谢谢你-有没有其他方法可以不用选择就可以做到这一点？它属于我的顶级导航，到目前为止，如果不使用ul，我无法将其格式化以适应其余菜单项。您可以使用ul作为选择菜单，但这需要更多的工作，并且您必须通过编程创建所有功能，这就是为什么有预制作的库可以做这种事情。谢谢。它正在尝试，但不是显示与链接相关的div，而是隐藏所有div。

<script type="text/javascript"> 
$(document).ready(function() {

  $('#Online-holder').show();
  $('#Online-link').click(function() {
    $('#Online').toggle(400);
    return false;
  });


  $('#Lowest-holder').hide();
  $('#Lowest-link').click(function() {
    $('#Lowest').toggle(400);
    return false;
  });


  $('#Alpha-holder').hide();
  $('#Alpha-link').click(function() {
    $('#Alpha').toggle(400);
    return false;
  });

});

jQuery("#selector1").change(function(){
    var div = jQuery(this).val();
    $('.holder').hide(200);
    jQuery(div).show(200);
});
</script>

jQuery("#selector1 li").click(function(){
  var div = jQuery("a", this).attr("value");
  $('.holder').hide(200);
  jQuery(div).show(200);
});