为了账号安全,请及时绑定邮箱和手机立即绑定

尝试添加 slideToggle() 函数但它不起作用

尝试添加 slideToggle() 函数但它不起作用

森栏 2021-10-21 14:26:28
我有一个自定义样式的选择选项代码,用于选择年份和月份。我想给它添加 jquery slideToggle() 效果。我正在尝试选择自定义定义的类,但它不起作用。以下是我的代码:/*Reference: http://jsfiddle.net/BB3JK/47/*/$('select').each(function(){    var $this = $(this), numberOfOptions = $(this).children('option').length;      $this.addClass('select-hidden');     $this.wrap('<div class="select"></div>');    $this.after('<div class="select-styled"></div>');    var $styledSelect = $this.next('div.select-styled');    $styledSelect.text($this.children('option').eq(0).text());      var $list = $('<ul />', {        'class': 'select-options'    }).insertAfter($styledSelect);      for (var i = 0; i < numberOfOptions; i++) {        $('<li />', {            text: $this.children('option').eq(i).text(),            rel: $this.children('option').eq(i).val()        }).appendTo($list);    }      var $listItems = $list.children('li');      $styledSelect.click(function(e) {        e.stopPropagation();        $('div.select-styled.active').not(this).each(function(){            $(this).removeClass('active').next('ul.select-options').hide();        });        $(this).toggleClass('active').next('ul.select-options').toggle();    });      $listItems.click(function(e) {        e.stopPropagation();        $styledSelect.text($(this).text()).removeClass('active');        $this.val($(this).attr('rel'));        $list.hide();        //console.log($this.val());    });      $(document).click(function() {        $styledSelect.removeClass('active');        $list.hide();    });});//select dropdown slide function$(document).ready(function(){  $(".select-styled").click(function(){    $(".select-options").slideToggle("slow");  });});在添加了 slideToggle() 脚本之后,它以某种方式同时滑动了两个选择菜单,并且以非常丑陋的方式(正如您可以在附加的代码段中体验到的那样)。请帮助我使 slideToggle() 效果完美。
查看完整描述

2 回答

  • 2 回答
  • 0 关注
  • 309 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号