jqplot冲突与jquerymobile

在同一个html页面我需要使用jquerymobile（www.jquerymobile.com）和绘制一个简单的图表与jqplot js库（www.jqplot.com）。jqplot冲突与jquerymobile

我想我有jqplot和jquerymobile之间的冲突问题，因为图表不显示。但是，如果我评论jquerymobile脚本的图表变得可见。

这是我的HTML代码的一部分：

[...head...] 
<link rel="stylesheet" type="text/css" href="jquery.jqplot.1.0.0b2_r792/dist/jquery.jqplot.css" /> 

<script type="text/javascript" src="jquery-1.7.1.js"></script> 
<script type="text/javascript" src="jquery.mobile-1.0/jquery.mobile-1.0.js"></script> 
<script type="text/javascript" src="jquery-ui-1.8.16.custom/js/jquery-ui-1.8.16.custom.min.js"></script> 

<script type="text/javascript" src="jquery.jqplot.1.0.0b2_r792/dist/jquery.jqplot.js"></script> 
<script type="text/javascript" src="jquery.jqplot.1.0.0b2_r792/dist/plugins/jqplot.canvasTextRenderer.min.js"></script> 
<script type="text/javascript" src="jquery.jqplot.1.0.0b2_r792/dist/plugins/jqplot.canvasAxisLabelRenderer.min.js"></script> 

[...script...] 
$(document).ready(function() { 
var plot1 = $.jqplot ('chart1', [[3,7,9,1,4,6,8,2,5]]); 
}); 

[...body...] 
<div class="jqplot" id="chart1" style="height:300px;width:400px;"></div>

任何建议为解决冲突？也许我想念什么？

由于提前， M.

来源

2011-12-06 matteo.poletti

是一个常见的问题，解决办法it's车...

请勿使用文档准备与jquerymobile，使用pageInit（）

在jquery论坛发现这个线程，它的工作与静态数据，但我从来没有使jqplot工作jQuery的jQuery调用jquerymobile。

http://forum.jquery.com/topic/ajax-problem-jquery-mobile-with-jqplot

祝你好运！

来源

2011-12-06 14:30:12

我爱jqplot，与jqmobile使用试试这个试试这个：

<script> 
$('#thirdpage').live('pageshow', function() { 
    $.jqplot('chart1', [[[1, 4],[3,7.10],[5,6],[7,3],[9,95.9],[121,416]]]); 
}); 
</script> 

     <!-- Page Three --> 
    <section id="thirdpage" data-role="page"> 
     <header data-role="header"> 
     <h1>Charts</h1> 
     </header> 
     <div data-role="content"> 

     <a href="#firstpage" id="firstpage">PageOne</a> 
     <a href="#secondpagepage" id="secondpage">Page2</a> 


    <div id="chart1" style="height:300px; width:500px;"></div> 

     </div> 
      </section>

来源

2012-07-02 19:59:55 Zeb99

还有一个更简单的方法（在我的情况下工作）：

- 第一： delare你绘制集装箱格以外的任何页面（例如正好低于标签标签）：

<body> 
<div id="plotContainer"></div> 
...

- 则：集剧情（图）在你的$（文件）。就绪（函数（）{... 这里 ...}）;和隐藏，这样就不会在页面之间显示：

$("#jqxChart").jqxChart(settings); 
$("#jqxChart").hide();

- finaly：只是DIV随着剧情复制你的页面内：

<script> 
$('#page_ID').bind('pageshow', function(data) { 
$("#jqxChart").appendTo("#ID_of_DIV_you_want"); 
$("#jqxChart").show(); 
$('#jqxChart').jqxChart('refresh'); 
}); 
</script>

希望这有助于！

来源

2014-09-10 08:06:19

jqplot冲突与jquerymobile

回答

相关问题