带有flot和AJAX导航的jQuery Mobile

前端之家收集整理的这篇文章主要介绍了带有flot和AJAX导航的jQuery Mobile前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我试图在jQuery Mobile项目中显示一个flot生成的图表.
如果我按照绝对路径调用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在不可见的占位符中不能很好地工作.试试这样:
$('#graph').bind('pageshow',function() {
    var plot = $.plot($("#chart"),[
        {
        label: "Oh hai",bars: {
            show: true
        }}
    ]);
});

在这里采取行动:http://jsfiddle.net/MT22y/8/

原文链接:https://www.f2er.com/ajax/159931.html

猜你在找的Ajax相关文章