如果x像素以上，则使用resize调整getScript(jQuery) [英] Using resize to getScript if above x pixels (jQuery)

问题描述

所以我对此脚本有疑问.它基本上是在任何大小调整事件上加载脚本.

So I have an issue with this script. It basically is loading the script on any resize event.

I have it working if lets say...
- User has window size above 768 (getScipt() and content by .load() in that script)
- Script will load (and content)
- User for some reason window size goes below 768 (css hides #div)
- User re-sizes again above 768, And does not load the script again! (css displays the div)

太好了.工作正常.

Now.. (for some cray reason)
- User has window size below 768 (Does NOT getScript() or nothing)
- User re-sizes above 768 and stops at any px (getScript and content)
- User re-sizes again anything above 768 (It getScript AGAIN)

我需要它仅获取一次脚本. 香港专业教育学院使用了这里的一些代码

I need it to only get script once. Ive used some code from here

jQuery:如何动态检测窗口宽度?

(编辑-我发现了这一点，他也遇到了一次加载脚本的问题.)

(edit - i found this, which he has the same issue of loading a script once.)

$(window)中的函数问题.调整大小-使用jQuery 和其他人，我失去了到:/

Problem with function within $(window).resize - using jQuery And others i lost the links to :/

当我第一次发现此问题时，我使用的是这样的东西，然后我添加了allcheckWidth()来解决问题.但事实并非如此.

When i first found this problem I was using something like this, then i added the allcheckWidth() to solve problem. But it does not.

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;
    });

    } else {
    }
    }
////// LETS GET SOME THINGS IF IS MOBILE
    if (windowsize < 768) { 
    } 
}
checkWidth();

function allcheckWidth () {
var windowsize = $window.width();
//// IF WINDOW SIZE LOADS < 768 THEN CHANGES >= 768 LOAD ONCE
var $desktop_load = 0;
    if (!$desktop_load) {
    if (windowsize < 768) {
            if ( $(window).width() >= 768) { 

        $.getScript("js/desktop.js", function() { 
            $desktop_load = 1;
        });

            }
    }   
        }

}
$(window).resize(allcheckWidth);

现在我正在使用类似的方法更有意义吗?

Now im using something like this which makes more sense?

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

请稍后再回答.

编辑-举个例子，在desktop.js中，我有一个gif，该gif在"abc"内容之前加载，该内容由.load()插入.调整大小后，此gif将显示，并且desktop.js中的.load()将再次触发.因此，如果getScript仅被调用一次，则它不应在desktop.js中再次执行任何操作.令人困惑?

Edit - To give an example, in desktop.js i have a gif that loads before "abc" content, that gets inserted by .load(). On resize this gif will show up and the .load() in desktop.js will fire again. So if getScript was only being called once, it should not be doing anything again in desktop.js. Confusing?

推荐答案

所以我昨晚解决了这个问题.我在另一个问题上回答了

So I solved the problem last night. I answered it on another question

此处 https://stackoverflow.com/a/11400128/1065573

这篇关于如果x像素以上，则使用resize调整getScript(jQuery)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！