我在将图表(jquery 图表)显示到网络时遇到了一些麻烦。
我有两个页面(1.html 和 2.html)。第一个包含与第二页链接的 ListView 。 2.html 显示图表。问题是:当通过第 1 页启动第 2 页时,图表没有出现!!但是如果我重新加载页面 2.. 那么图表就会出现!
如果我只处理一个使用“href=#page”引用的页面,图表可以正常工作并显示出来,但我的意图是使用不同的 html 文件,其中一个带有 ListView ,另一个带有图表。是否可以?
我测试了多种类型的 jquery 图表,它们都具有相同的行为。
有什么想法吗?
谢谢大家, 最好的问候。
这里是文件:
1.html ----
<head>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
</head>
<body>
<div data-demo-html="true">
<ul data-role="listview" data-inset="true">
<li><a href="2.html">Chart</a></li>
</ul>
</div>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js">/script>
</body>
2.html 将代码放入引用(jqwidgets - chart_bar)
最佳答案
要了解这种情况,您需要了解 jQuery Mobile 的工作原理。它使用 ajax 加载其他页面。
第一页正常加载。它的 HEAD 和 BODY 被加载到 DOM 中,它们在那里等待其他内容。当加载第二个页面时,只有它的 BODY 内容被加载到 DOM 中。
最现实的解决方案是将所有 javascript 移动到原始的第一个 HTML 中。收集所有内容并将其放入单个 js 文件中,放入 HEAD 中。在加载 jQuery Mobile 后对其进行初始化。我还会使用相同的 index.js 文件并在每个可能的其他页面的 HEAD 中对其进行初始化。
现在你可以问我为什么了?
像 jQuery Mobile 这样的 Phonegap 是错误的,如果您的每个 js 内容都在一个 HTML 文件中,迟早会出现错误并且您的应用程序将失败(包括加载的 DOM)。 DOM 可以被删除,Phonegap 将刷新您当前的页面。如果该页面没有 javascript,则在重新启动之前它将无法工作。
我在此处的回答中列出了解决此问题的其他方法(带有示例):Why I have to put all the script to index.html in jquery mobile .
关于javascript - jquery "listview"和图表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16667920/