jQuery的手機：如何刷新內部頁面，當你點擊按鈕

Question

我實現了導航從一個頁面（PAGE_1）到另一個頁面（page_2）當你點擊的按鈕。這些是內部頁面。但是，我想強制重新加載page_2當你點擊該按鈕（指當你從page_2回PAGE_1，按鈕上再次單擊導航在這個時候我想刷新頁面page_2）。如何實現這一點。我使用了下面的代碼，但它不工作。請任何人都可以幫助我。

Updated 

食品&練習屏幕

<div data-role="page" id="Page_1"> 
    <div data-role="header" data-theme="b" data-position="fixed">  
     <h1>Food_Exercise</h1> 
    </div> 
    <div data-role="content">           
     <div id="FItem1" data-role="fieldcontain" onclick="food_selection(this)">Select Food item</div>   
    </div> 
</div> 

< script type="text/javascript"> 
    function food_selection(ofoodsel) 
    { 
     $("#Food_Items").trigger("create");              
     $.mobile.changePage($("#Food_Items"), {transition: "pop"}); 
    }  
< /script> 

Food Screen 

<div data-role="page" id="Food_Items">  
    <div data-role="header" data-theme="b" data-position="fixed"> 
     <a data-role="button" data-rel="back" data-icon="back">back</a> 
     <h1>Food Items</h1> 
</div> 
    <div data-role="content"> 
     <form>          
      <div>   
       <select id="choice" name="choice" onchange="setFoodItemQty(this,Item_Qty)" size="1" > 
        <option selected="selected">Select Food Items</option>      
        <script type="application/javascript"> 
         setFoodItem(this); 
        </script> 
       </select>              
       <select id="Item_Qty" name="Item_Qty" disabled="disabled" size="1" onchange="setItemCal(choice,this)" ></select>                 
       <div id="Food_Calories" data-role="fieldcontain"></div> 
      </div>                                
     </form>  
     <a onclick="display_food()" data-role="button">Submit</a>    
</div> 
</div> 

Food Script 

< script type="text/javascript"> 
    var foodItems = Object(); 
    //Food 
    foodItems['Cooked rice'] = '1cup(100gms)|2cups(200gms)|3cups(300gms)|4cups(400gms)|5cups(500gms)|6cups(600gms)|7cups(700gms)'; 
    foodItems['Chapathi'] = '1(46.5gms)|2(93gms)|3(140gms)|4(186gms)|5(233gms)|6(279gms)'; 
    foodItems['Dosa'] = '1(50gms)|2(100gms)|3(150gms)|4(200gms)|5(250gms)|6(300gms)'; 
    foodItems['Sambar'] = '1cup(150gms)|2cups(300gms)|3cups(450gms)|4cups(600gms)|5cups(750gms)'; 
    foodItems['TomatoRasam'] = '1cup(130gms)|2cups(260gms)|3cups(390gms)|4cups(520gms)|5cups(650gms)'; 
    foodItems['Brinjal curry'] = '1cup(305gms)|2cups(610gms)|3cups(915gms)|4cups(1220gms)|5cups(1525gms)'; 

    //Calorie count arrays for Food 
    var cookedRiceArr = Object(); 
    cookedRiceArr[0] = '228 cal|456 cal|684 cal|912 cal|1140 cal|1368 cal| 1596 cal'; 

    var chapathiArr = Object(); 
    chapathiArr[0] = '101.5 cal|203 cal|304.5 cal|406 cal|507.5 cal|609 cal' 

    var dosaArr = Object(); 
    dosaArr[0] = '135 cal|270 cal|405 cal|540 cal|675 cal|810 cal' 

    var sambarArr = Object(); 
    sambarArr[0] = '100 cal|200 cal|300 cal|400 cal|500 cal'  

    var tomatoRasamArr = Object(); 
    tomatoRasamArr[0] = '156 cal|312 cal|468 cal|624 cal|780 cal'   

    var brinjalCurryArr = Object(); 
    brinjalCurryArr[0] = '215 cal|430 cal|645 cal|860 cal|1075 cal' 

    //End of food item calorie arrays 

    //Food Cohice 
    var choiceItem; 
    var foodQuantity; 
    var foodCal; 

    //Food item and Quantity instance 
    var foodItemInstance; 
    var qtyInstance; 

    function setFoodItem(oChoiceSel) 
    {   
     for (choice in foodItems) 
      document.write('<option value="' + choice + '">' + choice + '</option>');    
    } 

    function setFoodItemQty(oChoiceSel, oItemQtySel) 
    {  
     var itemQtyArr; 
     oItemQtySel.length = 0;   
     choiceItem = oChoiceSel.options[oChoiceSel.selectedIndex].text; 
     $('#Food_Calories').text("");    
     if (foodItems[choiceItem]) 
     { 
      $(oItemQtySel).selectmenu('enable');              
      oItemQtySel.options[0] = new Option('Select Quantity',''); 

      itemQtyArr = foodItems[choiceItem].split('|'); 
      for (var i = 0; i < itemQtyArr.length; i++) 
       oItemQtySel.options[i + 1] = new Option(itemQtyArr[i], itemQtyArr[i]); 

      $(oItemQtySel).selectmenu("refresh"); 
     } 
     else   
     {  
      $(oItemQtySel).selectmenu("refresh");         
      $(oItemQtySel).selectmenu('disable');        
     }  
    } 

    function setItemCal(oChoiceSel, oItemQtySel) 
    { 
     //instances 
     foodItemInstance = oChoiceSel; 
     qtyInstance = oItemQtySel; 

     foodQuantity = oItemQtySel.options[oItemQtySel.selectedIndex].text; 
     if(oChoiceSel.selectedIndex == 1) 
     { 
      var cookedRice = cookedRiceArr[0].split('|'); 
      for (var i = 1; i <= cookedRice.length; i++) 
      { 
       if(i == oItemQtySel.selectedIndex) 
       {      
        foodCal = cookedRice[i-1]; 
        $('#Food_Calories').text("Calories: "+cookedRice[i-1]);            
       }        
      } 
     } 
     if(oChoiceSel.selectedIndex == 2) 
     { 
      var chapathi = chapathiArr[0].split('|'); 
      for (var i = 1; i <= chapathi.length; i++) 
      { 
       if(i == oItemQtySel.selectedIndex) 
       {      
        foodCal = chapathi[i-1]; 
        $('#Food_Calories').text("Calories: "+chapathi[i-1]);      
       }       
      } 
     }  

     if(oChoiceSel.selectedIndex == 3) 
     { 
      var dosa = dosaArr[0].split('|'); 
      for (var i = 1; i <= dosa.length; i++) 
      { 
       if(i == oItemQtySel.selectedIndex) 
       {       
        foodCal = dosa[i-1];        
        $('#Food_Calories').text("Calories: "+dosa[i-1]);     
       }  
      } 
     } 

     if(oChoiceSel.selectedIndex == 4) 
     { 
      var sambar = sambarArr[0].split('|'); 
      for (var i = 1; i <= sambar.length; i++) 
      { 
       if(i == oItemQtySel.selectedIndex) 
       { 
        foodCal = sambar[i-1];       
        $('#Food_Calories').text("Calories: "+sambar[i-1]);       
       }       
      } 
     } 

     if(oChoiceSel.selectedIndex == 5) 
     { 
      var tomatoRasam = tomatoRasamArr[0].split('|'); 
      for (var i = 1; i <= tomatoRasam.length; i++) 
      { 
       if(i == oItemQtySel.selectedIndex) 
       {      
        foodCal = tomatoRasam[i-1];       
        $('#Food_Calories').text("Calories: "+tomatoRasam[i-1]);     
       }       
      } 
     } 

     if(oChoiceSel.selectedIndex == 6) 
     { 
      var brinjalCurry = brinjalCurryArr[0].split('|'); 
      for (var i = 1; i <= brinjalCurry.length; i++) 
      { 
       if(i == oItemQtySel.selectedIndex) 
       {      
        foodCal = brinjalCurry[i-1]+"cal";        
        $('#Food_Calories').text("Calories: "+brinjalCurry[i-1]);       
       }       
      } 
     }              
    } 
</script> 

Answer 1

我會去了解一下.trigger('create')

• http://jquerymobile.com/demos/1.0/docs/pages/page-scripting.html

創建與刷新：一個重要的區別 注意，還有就是創建事件和刷新方法，一些小部件之間有一個重要的區別。創建事件適用於增強包含一個或多個小部件的原始標記。刷新方法應該已經編程方式進行操作，並且需要用戶界面進行更新，以匹配現有（已增強）部件一起使用。例如，如果您有一個頁面在頁面創建後動態地添加一個新的具有data-role = listview屬性的無序列表，觸發該列表的父元素上的create會將其轉換爲listview樣式的小部件。如果以編程方式添加更多列表項，調用listview的刷新方法會將這些新列表項更新爲增強狀態，並保持現有列表項不變。

$("#pageId").trigger("create");