創建一個從Json的動態網頁，在道場

Question

我

{ 
    Introduction: 
    [ 
     { 
      title: "Introduction", 
      toolbar: "Page 1", 
      content: "cont, aabitant morbi tristique..." 
     }, 
     { 
      title: "about", 
      toolbar: "Page 2", 
      content: "contesent vel nisi ipsum..." 
     }, 
     { 
      title: "services", 
      toolbar: "Page 3", 
      content: "Cras adipiscing sapien nec..." 
     } 
    ] 
} 

我想創建道場移動動態頁面的JSON文件。從上面的Json開始，三個頁面將會前後移動。我遇到問題。我正在閱讀Json：

dojo.xhrPost({ 
     url: "start.json", 
     handleAs: "json", 
      var viewContainer = new dojox.mobile.ScrollableView({id:"viewContainer"}); 
     load: function(response) { 
      for (key in response){ 
         // creating each view heading and content here......... 
         //can you give some hint what should be here? 
        } 
     } 

如何讀取上面的json並創建動態視圖。有什麼能與這行代碼來代替//can you give some hint what should be here?

Answer 1

首先，你在錯誤的道路閱讀JSON。 dojo.xhrPost會將數據發送到您在url參數中指定的url：不檢索url參數中的文件。如果你這樣做你正在做的方式，你會用一個錯誤結束了諸如「無法加載start.json狀態：500」

所以，你的情況，閱讀文件，你應該做的改爲dojo.xhrGet。

接下來，您的viewContainer變量不應該放置在參數中間（您正在編寫的代碼在對象屬性（!!!）中間混合）。

所以...你應該能夠完成你想要做這樣的事情：

require(["dojo/dom-construct", 
    "dojo/_base/xhr", 
    "dojox/mobile/parser", 
    "dojox/mobile", 
    "dojox/mobile/ScrollableView", 
    "dojox/mobile/Heading"], 
      function(domConstruct) { 

       dojo.xhrGet({ 
        url : 'start.json', 
        handleAs : "json", 
        load : function(response) { 

         dojo.forEach(response.Introduction, function(page){ 
          var node = domConstruct.create("div", {id : page.title}, "viewsContainer", "last"); 
          var view = new dojox.mobile.ScrollableView({ 
           id : page.title 
          }, node); 
          view.addChild(new dojox.mobile.Heading({label : page.title})); 
          view.startup(); 
         }); 
        }, 
        error : function(err) { 
         console.debug("Error : ", err); 
        } 
       }); 
      } 
     ); 

Answer 2

load: function(response) { 
     for (key in response.Introduction){ 
        // creating each view heading and content here......... 
       } 

and try to debug data for key it should be any object that you pass 3 obj in json... 

Answer 3

here each key has three property that you define in json,now u can inject values to html view 
by accessing property like this key.title,key.toolbar....,ex:- $('<p>' + key.title + '</p>');