修改

Question

当我的窗口大小小于710px时，我想删除下拉菜单。问题是，当我从小（<710）变为大（> 710）时，卓尔下来菜单不再出现..

首先我尝试了：else {}但是有些如何保存.hover函数。在此之后我尝试了你可以在这里看到的代码。现在它没有保存变量＆＃34; UlLiUl＆＃34;对于if语句（控制台说：undefined）。

在此链接中，您会看到我尝试此操作的网站：link to site。你能帮我吗？我还是jQuery的新手。

$(document).ready (function () {
    DropDownMenu();

    $(window).bind('resize', function () {
        DropDownMenu();
    });
    function DropDownMenu() {

        if ($(window).width() > 710) {
            $('nav ul li').prepend(UlLiUl);
            $('nav ul li').stop().hover(
                function () {
                    $(this).children('ul').stop().slideDown(500);
                },
                function () {
                    $(this).children('ul').stop().slideUp(500);
                }
            );
        } else {
            var UlLiUl;
            UlLiUl = $('nav ul li ul').detach();
        }
    }
});

修改

现在比以前更好，但仍然不是我想要的。我的子内容具有不同的内容，但是使用您的jquery代码，它始终显示相同的子ul。在html部分的jsfiddle.net/17fpnoc5/1/中，你可以看到哪个特定的子ul属于导航的哪个特定的li（目前只有2个子ul）。随着＆＃34;第一个孩子＆＃34;它只显示了＆＃34; Startseite＆＃34;但在html for＆＃34; Startseite＆＃34;没有亚ul。谢谢！！

Answer 1

它会帮助你。您在if statemetnt中调用了UlLiUl，但它在else语句中定义。如果是其他声明，我在此之前接受了它。我存储了sub ul的所有html元素。然后检查窗口大小是否是greadter然后html元素正在前面，否则它是任何html元素然后删除它。

====================

修改

http://jsfiddle.net/61dfhz95/1/

检查一下。根据我的理解，你想隐藏李的子但里面没有ul。所以让你在里面有一些ul。如果窗口宽度将减小则调整大小，则将删除ul内容，如果宽度将更多，则存储在变量内的ul内容将被放置在li内。现在它正放在每一个里面。现在根据您的需要使用它，例如

if部分内的

使用：$('nav ul li:first-child').prepend(UlLiUl);或任何ID，类等，如下所示：http://jsfiddle.net/61dfhz95/3/

    $(document).ready (function () {
        var UlLiUl;
        UlLiUl = '<ul>'+$('nav ul li ul').html()+'</ul>';//.detach();            
        DropDownMenu();

    $(window).bind('resize', function () {
        DropDownMenu();
    });
    function DropDownMenu() {

        $('nav ul li ul').detach();
        if ($(window).width() > 710) {
            $('nav ul li').prepend(UlLiUl);
            $('nav ul li').stop().hover(
                function () {
                    $(this).children('ul').stop().slideDown(500);
                },
                function () {
                    $(this).children('ul').stop().slideUp(500);
                }
            );
        } else {
            $('nav ul li ul').detach();
        }
    }
});

Answer 2

你可以使用类似这样的东西。我确信这次你对我的回答感到满意。

这是一个新的小提琴链接：http://jsfiddle.net/61dfhz95/7/

她就是代码：

    $(document).ready (function () {
        UlLiUlValue=[];
        $('nav ul li ul').each(function(index, value){
            UlLiUlValue[index]='<ul>'+$(this).html()+'</ul>';
            $(this).parent('li').attr('class', 'has_sub');
        });
        DropDownMenu();
        $(window).bind('resize', function () {
            DropDownMenu();
        });
        function DropDownMenu() {
            $('nav ul li ul').detach();
            if ($(window).width() > 710) {
                $('nav ul li.has_sub').each(function(index,value){
                    $(this).append(UlLiUlValue[index]);
                });
                $('nav ul li').stop().hover(
                    function () {
                        $(this).children('ul').stop().slideDown(500);
                    },
                    function () {
                        $(this).children('ul').stop().slideUp(500);
                    }
                );
            } else {
                $('nav ul li ul').detach();
            }
        }
    });

使用jquery删除/恢复特定窗口大小的下拉菜单

修改

2 个答案:

修改