jquery - 如何只获取一次脚本

Question

所以这是一个简化的问题(我将其用作引用，以使这个问题变得简单......)

Using resize to getScript if above x pixels (jQuery)

如果我调用一个获取脚本的函数，那么如果该函数再次触发，它将不会再次加载脚本。

它在 ^ 代码中。

getScript - How to only call if not already called

是一个例子，但我不久前尝试过该代码。

例如:

$(function() 
{
  var gotscript=false;   
  $(window).resize(function() 
  {
      //Dekstop
      if (window.innerWidth >= 768) 
      {
           if (!gotscript) 
           {
               // GET DESKTOP SCRIPT TO KEEP THINGS QUICK
               $.getScript("js/desktop.js", function() 
               { 
                   gotscript=true;
               });
           }
       }
       if (window.innerWidth < 768) 
       {
           if (window.innerWidth >= 768) 
           {
               if (!gotscript) 
               {
                   // GET DESKTOP SCRIPT TO KEEP THINGS QUICK
                   $.getScript("js/desktop.js", function() 
                   { 
                       gotscript=true;
                   });
               }
            }
       }
   }) .resize(); // trigger resize event
})

这会在任何窗口调整大小事件上加载脚本。

我忘了说...

var $window = $(window);

function checkWidth() {
    var windowsize = $window.width();

    ////// LETS GET SOME THINGS IF IS DESKTOP 
    var $desktop_load = 0;
    if (windowsize >= 768) {
        if (!$desktop_load) {
            // GET DESKTOP SCRIPT TO KEEP THINGS QUICK
            $.getScript("js/desktop.js", function() { 
                $desktop_load = 1;
            });
        }
    }
    ////// LETS GET SOME THINGS IF IS MOBILE
    if (windowsize < 768) { 

    } 
}

// Execute on load
checkWidth();

当窗口大小高于 768 时，这将起作用，并且由于它只加载此函数一次，因此不会再次加载脚本。如果小于 768，我该怎么做才能使脚本加载，然后超过 768，并且不再加载它。

Answer 1

我预计问题与 getScript 异步有关，因此无法访问位于单独函数作用域内的 $desktop_load 变量。

解决方法是使 $desktop_load 成为全局变量。

试试这个，

var $desktop_load = 0; // <~~ move the variable into global scope
function checkWidth() {
    var windowsize = $window.width();

    ////// LETS GET SOME THINGS IF IS DESKTOP 
    // var $desktop_load = 0; // <~~ remove the variable from local scope

此外，这将避免您每次运行 checkWidth 函数时都将变量重新设置为 false，因为在测试之前它始终为 false - 这不是您想要的。

附:在 javascript 中使用 $ 为变量添加前缀是很不常见的，除非它是缓存的 jQuery 对象。