每次窗口调整大小时，jquery都会重复激活函数 - 但应该只执行一次

Question

我想用一些占位符PNG填充文章列表中的空白区域。 如果windowsize是320，则存在奇数项目 - ＆gt;填写1个占位符。

如果windowsize更大320并且只列出了一篇文章或者列出了一定数量的文章，则应添加一个或两个占位符。

工作正常，但每次windowsize更改时，脚本总会触发占位符。

这是：

$(document).ready(function() {

//the first loaded articlelist
var str = $('.item').length;
var width = $(window).width();

if ((str % 2) != 0 && width == 320) {
$('div.item').last().after('<div class="filler"></div>');
}
if ((str % 3) === 1 && width > 320) {
$('div.item').last().after('<div class="filler"></div><div class="filler"></div>');
}
if ((str  % 3) === 2 && width > 320) {
$('div.item').last().after('<div class="filler"></div>');
}

$(window).resize(function(){
    if($(this).width() != width){
        width = $(this).width()
        if ((str % 2) != 0 && $(window).width() == 320) {
        $('div.item').last().after('<div class="filler"></div>');
    }
    if ((str % 3) === 1 && $(window).width() > 320) {
        $('div.item').last().after('<div class="filler"></div><div class="filler"></div>');
    }
    if ((str  % 3) === 2 && $(window).width() > 320) {
        $('div.item').last().after('<div class="filler"></div>');
    }
    }
});
...

Answer 1

Jquery .one()应解决您的问题，它只允许绑定函数执行一次

$(window).one("resize", function(){...}