Html5boiler plate + jquery mobile =脚本加载两次

我正在使用html5样板作为html等基础的实验性jquery移动应用程序。

基本上到目前为止我所做的就是:

下载并提取html5样板，并在浏览器中查看。确保脚本/样式正确加载。准备好了。
添加$(document).ready(function () { console.log('ready'); });
重新加载。'ready'输出两次…
wtf bbq等检查情况在chrome inspector..注意所有的javascript文件似乎加载两次。
从头开始，在浏览器中提取h5bp load，特别注意脚本加载一次。添加文档就绪处理程序，观察一个'ready'输出。
添加jquery移动观察脚本加载一次。
将所有脚本移动到标签中。脚本加载一次。

有人知道发生了什么事吗?这应该是很容易重现，只需提取h5bp和添加jquery移动到底部的脚本部分，突然脚本都加载两次。将所有这些脚本移到modernizr下面(或之前)的head标签中，这样就不会再发生这种情况了。

谢谢

Modernizr使用YepNope来加载脚本。如果你看一下这里的问题:https://github.com/SlexAxton/yepnope.js/issues/10

你会看到脚本被故意加载了两次:

Yepnope会两次请求您放入的每个文件。第一次它将自己作为某种不可执行的实体加载到缓存中(object元素，或img元素，或带有伪元素的脚本元素类型属性(取决于浏览器)。第二次是注入，我们把它作为可执行脚本注入，这次它是缓存。所以这只需要几毫秒甚至更短的时间要执行回调函数并重新插入脚本标记额外(和)无论访问缓存需要多长时间)。

在http://yepnopejs.com主页上也提到了这一点。点击这里，向下滚动到I'm seeing two requests in my dev tools, why is it loading everything twice?

将<script>document.ready()</script>放入<head></head>将解决此问题。

是否使用$(document).ready()??

遇到同样的问题，并感到沮丧，没有结束，注意到，如果我把所有的JS文件的头部工作良好。当我切换到一切使用pageinit开始正常工作与JS在页面的底部，它属于。

的例子:

<div id="mainPage" data-role="page">
    <script type="text/javascript">
        $("#project_map_page").live('pageinit', function() {
        // INSERT JS HERE
        });
    </script>
</div>

详情请访问:http://jquerymobile.com/demos/1.0/docs/api/events.html

我尝试在一个基本的html页面上添加jQuery和jQuery Mobile，它似乎也是这样发生的。所以不要认为这和h5bp基因有关。你能试着去掉h5bp的东西，然后重新加载吗?

确保你的根div是这样的…

<body>
<div data-role="page">
 <!-- Content -->
</div>
</body>

相关内容

最新更新

热门标签：