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");