Question

一旦窗口调整到771px以上或以下，我将使用下面的代码执行我的jQuery命令。我怎么告诉浏览器只有当它突破771px时再执行一次，然后当它再次回到下面时再次执行。

  jQuery(window).resize(function(){

        if (jQuery(window).width() >= 771){   
            console.log(">"); 

        }  

        if (jQuery(window).width() < 771){    
            console.log("<");    
        } 

   });

使用此代码这是控制台记录＆＃34;＆lt;＆＃34;对于每个像素一次，浏览器窗口会发生变化，所以很多次，我只希望它在上面一次，一次在下面时。

Answer 1

浏览器不会为您做到这一点。您必须保留resize事件处理程序，并将先前的宽度保留在变量中。然后将当前与前一个进行比较。

这样的事情：

var previousWidth = jQuery(window).width();
jQuery(window).resize(function(){
    var currentWidth = jQuery(window).width();
    var threshold = 771;

    if (previousWidth < threshold && currentWidth >= threshold)
        console.log(">");

    if (previousWidth >= threshold && currentWidth < threshold)
        console.log("<");

    previousWidth = currentWidth;
});

jQuery（window）.resize函数只触发一次不是每一个像素

1 个答案: