在使用jQuery调整窗口大小时撤消预结束

如果窗口有一定的大小，我现在有一个jQuery来前置一个

div

if ( $(window).width() < 480) {

   $('nav').css("display","none");

   $('#container').prepend('<div id="nav-btn"></div>');  
}

if（$（窗口）.width（）<480）{
$（'nav'）.css（“显示”、“无”）；
$（“#容器”）。前缀（“”）；
}

在调整浏览器大小时，如何使其“持续”检查并隐藏

编辑：我希望这样，当窗口宽度达到481px时，

元素设置为

display:block和
#导航btn
被隐藏。但是动态的，所以它可以一次又一次地调整大小，而不仅仅是一次

$(window).resize(function(){
    if ($(window).width() >= 481) {
        $("#nav-btn").remove();
        $("nav").css("display", "block");
    }
});


当浏览器窗口的大小更改时，调整大小事件将发送到窗口元素：

以下内容达到了您的要求（据我所知）：

$（窗口）。调整大小（函数（）{
如果（$（窗口）.width（）<482）{
$（'nav'）.css（“显示”、“无”）；
if（！$（'#nav btn'）.length）{//确保只有一个导航按钮div
$（''，{'id'：'nav btn'}）
.text（'这是文本，在导航按钮中'）
.appendTo（$（“#container”）；
}
}
否则{
$（'nav'）.css（'display'，'block'）；
$（'#导航btn'）。删除（）；
}
});
$（文件）。准备好了吗(
函数（）{
$（window.trigger（'resize'）；//确保在DOMReady上执行调整大小的操作
});​


参考资料：






$(window).resize(function() {
    // Type your code here
});

$(window).resize(function() {
    if ($(window).width() < 482){
       $('nav').css("display","none");
        if (!$('#nav-btn').length){ // makes sure there's only ever one nav-button div
           $('<div />', {'id' : 'nav-btn'})
               .text('This is text, in the nav button')
               .appendTo($('#container'));
        }
    }
    else {
        $('nav').css('display','block');
        $('#nav-btn').remove();
    }
});

$(document).ready(
    function(){
        $(window).trigger('resize'); // making sure the resize stuff happens on DOMReady
    });​