jQuery调整大小，没有按预期执行

Question

我正在构建我的菜单行为，并希望对jQuery使用一些媒体查询。

This is the basic functionality of the menu.我只希望在nav ul li为display: block时加载此内容。一旦它们是inline-block或其他内容，我就不想使用slideToggle。

我尝试使用resize.function中所述的slideToggle，但是当我这样做时，li会在点击时发生两次this article。

在初始加载时，当您单击下拉列表li时，它会按预期执行，但如果您调整窗口大小，则单击$(window).resize(function(){ if ($("header nav ul li").css("display") == "block" ){ $( ".dd" ).click(function() { $( ".submenu" ).slideToggle( "slow" ); $( ".ar" ).toggleClass( "up" ); }); } }).trigger('resize'); 它滑动切换两次;我想知道为什么会这样，因为我对jQuery很新。

JS

{{1}}

Answer 1

<强>更新

无需将其绑定到resizing，只是防止它被触发，除非li元素是“block”。这是有效的，试一试。

$( ".dd" ).click(function() {
    if ($("header nav ul li").css("display") == "block"){
        $(this).parent().find( ".submenu" ).slideToggle( "slow" );
        $(this).find( ".ar" ).toggleClass( "up" );
    }
});