JQuery-mobile：通過AJAX請求加載JQPlot圖形

我是JQuery Mobile上的新手，我試圖根據用戶選擇顯示帶有JqPlot圖形的頁面。JQuery-mobile：通過AJAX請求加載JQPlot圖形

我今天早上閱讀和實驗，通過設計單擊鏈接顯示/加載的頁面的JavaScript代碼不會執行。

要考慮加載頁面的JS腳本，鏈接的數據屬性data-ajax必須設置爲false。但是在這種情況下，瀏覽器會重新加載所有頁面，並且用戶沒有平滑過渡。

<p><a href="myUrl.php" data-ajax= "false" data-transition="slideup" data-role="button" data-theme="c">

我已經找到一種方法來弄明白，但我需要我的代碼專家評審。這個想法是在圖形容器頁#page-detail上聲明一個事件pageshow，以通過JQuery函數加載圖形創建頁面。

通過這種方式，我能夠：

順利過渡到我的網頁
有一個加載的div在我的圖表將被載入
渲染我的圖表時，數據加載和JqPlot圖準備

我的代碼：

$(document).on('pageshow','#page-detail',function(){  
     //Apply a loading layer to the graph container 
     $('#graph-container').html("<div id='graph-loading-layer' class='loading loading-col2a'>"+g_graphLoadingText+"</div>");      

     //Load my graphic page creation. In this page, there are JS code to create the JQplot graphic 
     $('#graph-container').load(g_baseUrl+"index/graph/format/html",{chartHeight : newHeight+'px'},function(response, status, xhr) { 
      console.log('loaded') 
     });     
    });

我上面的解決方案是痛苦的我確信我可以很容易地加載我的圖表有沒有人有更好的解決方案？更好的代碼實現？

來源

2012-12-07 sdespont

JQuery是一個很好的選項，用於加載頁面，包括按照標準頁面加載執行Javascript並應用CSS。我在一個MVC單頁面網站中使用了這種技術，並發現它非常有效。

我並沒有完全清楚你對鏈接的擔憂，但肯定在鏈接的'click'處理程序中使用JQuery .load（）也是可行的。

你的代碼看起來很合理，很高興看到你在異步加載時應用加載層。我不能確定100％該層是否適合您，但我認爲您可能需要在完成後隱藏/刪除它，因此可能需要在您的後加載處理程序中添加一些額外的代碼，以便這樣做？

來源

2012-12-07 11:12:49

是的，你是對的。但我的問題更多的是關於'.load（）'在JQuery Mobile上下文中的使用情況。我上面的解決方案是痛苦的，我確信我可以很容易地加載我的圖表 – sdespont

使用此選項對您來說尤其「痛苦」，以及您探索了哪些替代方案？ –

感謝您更新您的答案。實際上，頁面加載完成後，加載圖層會被圖形代碼覆蓋。 – sdespont

JQuery-mobile：通過AJAX請求加載JQPlot圖形

回答

相關問題