javascript - 怎么解决collapse下拉框防止连续点击问题
PHP中文网
PHP中文网 2017-04-10 17:35:28
0
0
230


每次点击面板都会触发下拉文本,连续点击的话会形成持续的动画,就是上下来回关闭打开,怎么解决这个问题代码添加到哪里!


请输入代码$('.ui-collapse-content').hide();
    //插入span标签用来制作三角标志
    $('<span class="ui-collapse-icon">').appendTo('.ui-collapse-name');
    //点击标题相对应的内容展开,再次点击后折叠
        $('.ui-collapse-name').bind("click",function() {//绑定手机事件
        var _con = $(this).next('.ui-collapse-content');
        if (!_con.hasClass("ui-collapse-show")) {
            //获取所有的元素
            var _allCon = $(".ui-collapse p.ui-collapse-content");
            for (var i = 0; i < _allCon.length; i++) {
                if ($(_allCon[i]).hasClass("ui-collapse-show")) {
                    
                    $(_allCon[i]).removeClass("ui-collapse-show");
                    $(_allCon[i]).prev("p").children("span").removeClass("ui-icon-up");
                    $(_allCon[i]).slideToggle("slow");
                }
            }
            _con.addClass("ui-collapse-show");
            _con.prev("p").children("span").addClass("ui-icon-up");
        }else{
            _con.removeClass("ui-collapse-show");
            _con.prev("p").children("span").removeClass("ui-icon-up");
        }
        _con.slideToggle("slow");
    });
PHP中文网
PHP中文网

认证0级讲师

모든 응답(0)
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!