Question

当窗口宽度为500px或更小时，我有jQuery代码为页面内容制作手风琴。它工作正常，但几乎没有问题。当我调整窗口大小（例如从900px到450px）并单击accordion h3链接以打开内容时，它会表现得很严重。它打开和关闭内容4次，在打开后，关闭开放式手风琴时也是如此。

我想我在这里遗漏了一些明显的东西，但却无法弄清楚它是什么。

jQuery(window).on("load resize",function(e){

jQuery(function() {
    if(jQuery(window).width() <= 500) {


        //ACCORDION BUTTON ACTION   
        jQuery('h3').click(function() {
            if(jQuery(this).data("slided") === true) {
                jQuery(this).next().slideUp('normal');
                jQuery(this).data("slided", false);
            } else {
                jQuery('h3').data('slided',false);
                jQuery('.sec').slideUp('normal');   
                jQuery(this).next().slideDown('normal');
                jQuery(this).data("slided", true);
            }
        });

        //HIDE THE DIVS ON PAGE LOAD    
        jQuery(".sec").hide();
    } else { jQuery(".sec").show(); }
});
});

在我的JFIDDLE示例中，它似乎更多地打开了闭合手风琴。

Answer 1

以下是正确代码（您可以找到FIDDLE here）：

//ACCORDION BUTTON ACTION    
$('h3').click(
    function() {                   
        if (jQuery(window).width() <= 500) {                               
            if(jQuery(this).data("slided") === true) {
                jQuery(this).next().slideUp('normal');
                jQuery(this).data("slided", false);
                //alert('slided');                        
            }                                
            else {
                jQuery('h3').data('slided',false);
                jQuery('.sec').slideUp('normal');   
                jQuery(this).next().slideDown('normal');
                jQuery(this).data("slided", true);
            }
        }
    } );

开始和停止手风琴响应

1 个答案: