Question

假设有暴民，制表和桌子要点。 mob is "<768" tab is "> = 768" and "<1024" desk is "> 1024"

事实证明，当您到达选项卡时，您需要执行一次功能，如果窗口已更改并成为暴民，则再次需要执行一次功能，等等。

我这样做了

$(function() {
  var isDevice = "mob"; /* mob tab desk */

  $(window).on("resize", function() {
    var windowWidth = $(window).width();
    if (windowWidth < 768) {
      if (isDevice != "mob") {
        isDevice = "mob";
        console.log(isDevice);
      }
    } else if (windowWidth >= 768 && windowWidth < 1024) {
      if (isDevice != "tab") {
        isDevice = "tab";
        console.log(isDevice);
      }
    } else if (windowWidth >= 1024) {
      if (isDevice != "desk") {
        isDevice = "desk";
        console.log(isDevice);
      }
    }
  });
});

这可以按预期工作，但是也许有更好的方法来实现它？

链接到codepen.io。

Answer 1

$(function() {
  var isDevice = "mob" /* mob tab desk */
  var doit;
  window.onresize = function(){
    clearTimeout(doit);
    doit = setTimeout(resizedw, 500);
  };   
});

function resizedw(){

 var windowWidth = $(window).width();
 //Implement logic here
    

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

调整大小后如何运行脚本？

1 个答案: