Javascript jqplot与jquerymobile冲突

Javascript jqplot与jquerymobile冲突,javascript,jquery,jquery-mobile,jqplot,Javascript,Jquery,Jquery Mobile,Jqplot,在同一个html页面中,我需要使用jquerymobile()并使用jqplot js库()绘制一个简单的图表 我认为jqplot和jquerymobile之间存在冲突问题,因为图表没有显示。但是如果我对jquerymobile脚本进行注释,图表就会显示出来 这是我的html代码的一部分: [...head...] <link rel="stylesheet" type="text/css" href="jquery.jqplot.1.0.0b2_r792/dist/jquery.jqpl

在同一个html页面中,我需要使用jquerymobile()并使用jqplot js库()绘制一个简单的图表

我认为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>
[…头…]
[…脚本…]
$(文档).ready(函数(){
变量plot1=$.jqplot('chart1',[[3,7,9,1,4,6,8,2,5]]);
});
[…正文…]
有没有克服冲突的建议?也许我错过了什么

提前感谢,,
M.

是一个常见的问题,它的解决方法是有缺陷的

不要将DocumentReady与jquerymobile一起使用,请使用pageInit()

在jqueryforum中发现了这个线程,它可以处理静态数据,但我从来没有让它在jquerymobile上通过json调用来处理jqplot


祝你好运

是一个常见的问题,它的解决方法是错误的

不要将DocumentReady与jquerymobile一起使用,请使用pageInit()

在jqueryforum中发现了这个线程,它可以处理静态数据,但我从来没有让它在jquerymobile上通过json调用来处理jqplot


祝你好运

我喜欢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>

$(“#第三页”).live('pageshow',function(){
$.jqplot('chart1',[[1,4],[3,7.10],[5,6],[7,3],[9,95.9],[121416]];
});
图表

我喜欢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>

$(“#第三页”).live('pageshow',function(){
$.jqplot('chart1',[[1,4],[3,7.10],[5,6],[7,3],[9,95.9],[121416]];
});
图表

有一种更简单的方法(在我的情况下有效):

-首先:del打印容器div是否位于任何页面之外(例如,就在body标记下方):

-最后:只需在页面内复制带有绘图的div:

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

$('#page_ID').bind('pageshow',函数(数据){
$(“#jqxChart”)。附加到(“#您想要的分区的ID”);
$(“#jqxChart”).show();
$('jqxChart').jqxChart('refresh');
});

希望这有帮助

有一种更简单的方法(在我的情况下有效):

-首先:del打印容器div是否位于任何页面之外(例如,就在body标记下方):

-最后:只需在页面内复制带有绘图的div:

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

$('#page_ID').bind('pageshow',函数(数据){
$(“#jqxChart”)。附加到(“#您想要的分区的ID”);
$(“#jqxChart”).show();
$('jqxChart').jqxChart('refresh');
});
希望这有帮助