我试图在jQuery Mobile项目中显示一个flot生成的图表.
如果我按照绝对路径调用jQuery Mobile页面(例如: http://server.com/graph/fancy.php),一切正常,但是一旦我开始使用jQM集成的AJAx导航,图表就会变得混乱.
如果我按照绝对路径调用jQuery Mobile页面(例如: http://server.com/graph/fancy.php),一切正常,但是一旦我开始使用jQM集成的AJAx导航,图表就会变得混乱.
我还发现了另一个话题jquery mobile and flot library,但所描述的解决方案都没有对我有用.
有没有办法让jQM和flot一起工作?不幸的是,禁用AJAX也不是一种选择.
图表生成:
<script type="text/javascript"> var data = [[0,3],[4,8],[8,5],[9,13]]; $(function () { var plot = $.plot($("#chart"),[ { label: "Oh hai",data: data,bars: { show: true } } ]); }); </script> <div id="chart" style="width: 600px; height: 350px;"></div>
您需要做的是将绘图功能移动到pageshow事件中.这是因为flot在不可见的占位符中不能很好地工作.试试这样:
原文链接:https://www.f2er.com/ajax/159931.html$('#graph').bind('pageshow',function() { var plot = $.plot($("#chart"),[ { label: "Oh hai",bars: { show: true }} ]); });
在这里采取行动:http://jsfiddle.net/MT22y/8/