元素在重复触发时忽略 jQuery

我正在使网站响应式，到目前为止它运行良好，不过我目前遇到的一个问题是，如果我反复快速更改窗口大小，它似乎忽略了jQuery。当这种情况发生时，一个在满足条件时应该"显示：none;"的元素会留在页面上。

css 很简单：

body:after{display:none; content:"default";}
@media only all and (max-width: 800px){
    body:after{content:"tablet";}
}

jquery看起来像这样：

jQuery(document).ready(function($) {
    var currentSize = "default";
    var lazyLayout = _.debounce(function(e) {
    }, 300, true);
    $(window).resize(lazyLayout,function() {
            var size = window.getComputedStyle(document.body, ':after').getPropertyValue('content');
            /* Ridiculous thing to deal with inconsistent returning of 
            value from query. Some browsers have quotes some don't */
            size = size.replace(/"/g, "");
            size = size.replace(/'/g, "");
            if (size != currentSize) {
                if (size == 'tablet') {
                    var count = $('#mobileNav').length;
                    if (count < 1) {
                        var data = {
                        dataType: "HTML",
                        action: 'nav_media_query',
                        nonce: myAjax.nonce
                    };
                    $.post( myAjax.url, data, function( data ) {
                        $('#content-wrapper').removeClass('col-4-5');
                        $('#trending-Container').addClass('mobileNavStyle');
                        $('#trending-Container').append(data);
                        });
                    currentSize = 'tablet';
                    }
                }  
                if(size == 'default') {
                    $('#mobileNav').remove();
                    currentSize = 'default';
                }
            }
    }).resize();
});//end function 

这将检查是否已加载媒体查询，但查找内容属性，然后触发ajax请求并将一些wordpress php加载到元素中。

如果我慢慢调整窗口大小，它可以完美地工作，但如果我快速反复调整窗口，它会破裂。

我可以使用一些jQuery函数来阻止它中断吗？

编辑：我已经更新了我的代码以添加_.js debounce方法，这应该有助于限制ajax请求。但是，在不再满足要求后未删除元素的问题仍然存在。