Question

我正在构建一个响应式网站，用作SharePoint 2013母版页，使用skel.js来控制网格和断点。发布后，js文件（skel.min.js，skel-panels.min.js，jquery.min.js，html5shiv.js以及我编写的简单config.js来配置skel和skel-panels）每次用户访问网站时都不会可靠地运行，而是将CSS冻结在浏览器当时匹配的任何断点处。刷新通常修复了这个问题，但这不是一个可接受的解决方案。到目前为止，这种情况发生在IE，Chrome和FF（所有版本都不会触发html5shiv）。

有没有人有解决skeljs的经验，或者知道这种行为的更高级别原因？我不熟练使用JavaScript来为自己解决这个问题，但即使推动正确的方向也会受到赞赏。

更新：抓住IE Developer Tools（IE10）中的一个错误。控制台报告SCRIPT5007: Unable to get property 'match' of undefined or null reference并在第25行第484位指向skel-panels.min.js。我查看了该行，违规声明似乎是：

b.attr("class").match(/(\s+|^)([0-9]+)u(\s+|$)/)&&b.data("cell-size",parseInt(RegExp.$2))};

这是否提供了有用的见解？我认为这是最常见的错误，但相信还有其他错误。我将继续尝试在所有浏览器中捕获所有这些内容。

更新2：根据要求，以下是对头部中js文件的调用。请注意，这些已经转换为SharePoint母版页语法（在发布页面时会自动执行），但它们与“标准”js引用相同，而SharePoint不会改变它们的工作方式。

    <!--MS:<script type="text/javascript" src="/_catalogs/masterpage/SiteName/js/jquery.min.js">//<![CDATA[-->
    <!--ME://]]></script>-->
    <!--MS:<script type="text/javascript" src="/_catalogs/masterpage/SiteName/js/config.js">//<![CDATA[-->
    <!--ME://]]></script>-->
    <!--MS:<script type="text/javascript" src="/_catalogs/masterpage/SiteName/js/skel.min.js">//<![CDATA[-->
    <!--ME://]]></script>-->
    <!--MS:<script type="text/javascript" src="/_catalogs/masterpage/SiteName/js/skel-panels.min.js">//<![CDATA[-->
    <!--ME://]]></script>-->

这是SharePoint在其自己的评论中包装它之前的样子：

<script type="text/javascript" src="/_catalogs/masterpage/SiteName/js/jquery.min.js"></script>

以下是另一个例外：SCRIPT438: Object doesn't support property or method '_skel_panels_close'在{6}字符192的skel-panels.min.js中，正好在此语句的中间：c.is(":visible")?c._skel_panels_close():c._skel_panels_open()};

同样根据要求，我在上面提到的第一个声明之前添加了console.log(b);console.log(b.attr("class"));，以查看失败时b是什么。当它工作时，b的两个实例都是“6u”，这是skel.min.js中的一个类，它定义了一行内部分的宽度。当脚本失败时，只记录b的第一个实例，它是“未定义的”。

更新3：根据多人的建议，我尝试在页面末尾加载js，但这打破了所有脚本。在做了一些阅读后，我决定重新安排css和脚本链接的顺序，以便首先加载css。我发现虽然现代浏览器使用推测性解析，但顺序无关紧要。我通过在加载页面时看不到明显的行为变化来确认这一点。但是作为参考，脚本首先出现（大约在SharePoint调用的默认脚本之后的一半），然后css链接在head的底部。我还没有找到解决这个问题的方法，所以欢迎任何建议！

Answer 1

当脚本标记添加到母版页时，Design Manager会附加XML注释：

//<![CDATA[

和

//]]

即使<script>和</script>之间的阻止内容为空。该特定行为导致skel.js中断 - 因为skel.js期望从此脚本块的内容（这是可能的配置方式之一）读取其配置，因为{{1}解析了XML注释并理解为无效的配置条目。

解决方案非常简单：您应该使用SharePoint ScriptLink，而不是使用skel.js来引用<script>文件：

skel.js

希望这有帮助。

德拉甘

Answer 2

可能没有关系，但值得一提......让你在ASP.NET上摆动（见下面'〜'）src =“〜 / _ catalogs / masterpage / SiteName / js / jquery。 min.js“

您是否尝试过不使用麻烦的.js文件的缩小版本？显然你想要缩小，但要扔掉那里。

有人提到在你的html文档的末尾有你的js以允许dom完全加载。我很好奇你如何拥有CSS文件和JS加载。你如何在html dom中订购你的css / js文件？

最后，您是否可以在本地计算机上重现此问题，还是仅在最终用户发布后才会重现？对我来说听起来像是一个DOM问题。虽然本地一切看起来都很好，但是当添加延迟时，你的DOM没有完全加载，因此你的响应式设计和js的效果不佳。

在头部调用的js并不总是加载

2 个答案: