0

如果window.width >= 768，我需要附加一个脚本，否则，如果window.width <768，则附加另一个脚本。

这是我的初始脚本，它实际上有效：

function appendScript(stickname){

    var head = document.getElementsByTagName("head")[0]; var js = document.createElement("script");
    js.type = "text/javascript"; js.src = "site/js/" + stickname + ".js";
    head.appendChild(js); 
    }

    if ($(window).width() >= 768) { appendScript("stick");}
    else {appendScript("stick-mobile")}

这有效，但它当然不适用于调整窗口大小。因此，例如，当您将浏览器窗口缩小到小于 768px 宽时，您必须点击刷新才能使脚本再次工作.. 更糟糕的是：例如，如果您使用的是小型平板电脑，它不会在您切换时切换脚本方向。

我试过这个：

function appendScript(stickname){

    var head = document.getElementsByTagName("head")[0]; var js = document.createElement("script");
    js.type = "text/javascript"; js.src = "site/js/" + stickname + ".js";
    head.appendChild(js); 
    }
    $(window).resize(function() {
    if ($(window).width() >= 768) { appendScript("stick");}
    else {appendScript("stick-mobile")}
    });

这仅在最初调整浏览器大小时才有效。这当然是不可接受的。有人可以帮忙吗？太感谢了！

4

2 回答 2

0

你能告诉我这段代码放在一个javascript标签中是否有效吗？

function appendScript(stickname){
  var head = document.getElementsByTagName("head")[0];
  var js = document.createElement("script");
  js.type = "text/javascript";
  js.src = "site/js/" + stickname + ".js";
  head.appendChild(js); 
}

(function(){

  if ($(window).width() >= 768) { appendScript("stick");}
  else {appendScript("stick-mobile")}

  $(window).resize(function() {
    if ($(window).width() >= 768) { appendScript("stick");}
    else {appendScript("stick-mobile")}
  });

})();

只是一个问题：在 appendScript() 中，你不应该也 removeChild(...) 以前的脚本吗？并为此在您的脚本元素上添加一个类，以区分它们？

于 2013-07-12T09:47:00.890 回答
0

没有人回答，但这可能对其他人有帮助，一位朋友帮我解决了这个脚本，这似乎有效（即使萤火虫的行为很奇怪）

window.onload = windowload;
    window.onresize = AppendScript;

    function windowload() {
        AppendScript();
    }


    function AppendScript() {

        if (window.innerWidth >= 768) {
            Include('site/js/stick.js', 'on')
            Include('site/js/stick-mobile.js', 'off')
        }
        else {
            Include('site/js/stick.js', 'off')
            Include('site/js/stick-mobile.js', 'on')
        }
    }

    function Include(filename, status) {
        var head = document.getElementsByTagName('head')[0];
        if (status == 'on') {
            script = document.createElement('script');
            script.src = filename;
            script.type = 'text/javascript';
            head.appendChild(script)
        }
        else if (status == 'off') {
            var scripts = head.getElementsByTagName('script');
            if (scripts.length > 0) {
                head.removeChild(scripts[1]);
            }
        }
    }
于 2013-07-12T15:09:13.273 回答