jquery手機更新無需重寫

我有這個小代碼，除了一件事情很好：如果我的可摺疊集擴展，它會每5秒倒退一次，因爲我設置了setTimeout(loadPage,5000)。我的問題是：如何在不重寫的情況下構建這個小代碼，所以即使它被擴展了，它也會更新而不會崩潰。。。jquery手機更新無需重寫

$(document).bind('pageinit', function() { 
    var globalVar = {}; 

    function loadData() { 
     $.ajax({ 
      url: "http://jsbin.com/wulol/2.js", 
      async: false, 
      dataType: 'json', 
      success: function (data) { 
       globalVar = data; 
      } 
     }); 
    } 

    function loadPage() { 
     var items = ''; 
     $.each(globalVar, function (index, item) { 
      items += "<div data-role='collapsible' id='" + item.id + "'>"; 
      items += "<h3>"; 
      items += "<div class='ui-grid-c'>"; 
      items += "<div class='ui-block-a'>" + item.airline + "</div>"; 
      items += "<div class='ui-block-b'>" + item.number + "</div>"; 
      items += "<div class='ui-block-c'>" + item.people + "</div>"; 
      items += "<div class='ui-block-d'>" + item.time + "</div>"; 
      items += "<div class='ui-block-a'></div>"; 
      items += "<div class='ui-block-b'></div>"; 
      items += "<div class='ui-block-c'></div>"; 
      items += "</div>"; 
      items += "</h3>"; 
      items += "<p><input type='button' value='Button'></p>"; 
      items += "</div>"; 
     }); 
     $("#result").html(items); 
     $("#result").trigger('create'); 
     setTimeout(loadPage, 5000); 

    } 

    function ignite() { 
     loadData(); 
     loadPage(); 
    } 
    window.onload = ignite; 
});

這裏是工作DEMO 我真的需要你的幫助，地球人！！！

來源

2014-04-25 Besan Vadim

你需要比較的div，如果存在忽略它，如果不追加它$（「＃結果」） – aimadnet

Aimadnet，你可以請，不知何故，更具體一點。。。我的意思是，一個例子會拯救我的生命:)謝謝 p.s.我添加了一個工作的DEMO，這樣你就可以看到我在說什麼了。 –

@ user3115243你有沒有試過我的答案？ –

您可以使用append（）而不是html（），但在需要檢查項目是否已存在於#result之前。

DEMO：http://jsbin.com/yabopuzu/1/edit

$(document).bind('pageinit', function(){ 
    var globalVar = {}; 
    function loadData(){ 
     $.ajax({ 
      url: "http://jsbin.com/wulol/2.js", 
      async: false, 
      dataType: 'json', 
      success: function(data){ 
      globalVar = data; 
      } 
     }); 
    } 
    function loadPage(){ 
     var items=''; 
     $.each(globalVar,function(index,item) 
     { 
      if ($("#result #item"+item.id).size()==0) 
      { 
       items+= "<div data-role='collapsible' id='item"+item.id+"'>"; 
       items+= "<h3>"; 
       items+= "<div class='ui-grid-c'>"; 
       items+= "<div class='ui-block-a'>"+item.airline+"</div>"; 
       items+= "<div class='ui-block-b'>"+item.number+"</div>"; 
       items+= "<div class='ui-block-c'>"+item.people+"</div>"; 
       items+= "<div class='ui-block-d'>"+item.time+"</div>"; 
       items+= "<div class='ui-block-a'></div>"; 
       items+= "<div class='ui-block-b'></div>"; 
       items+= "<div class='ui-block-c'></div>"; 
       items+= "</div>"; 
       items+= "</h3>"; 
       items+= "<p><input type='button' value='Button'></p>"; 
       items+= "</div>"; 
      } 
     }); 
     $("#result").append(items); 
     $("#result").trigger('create'); 
     setTimeout(loadPage,5000); 
    } 
    function ignite(){ 
     loadData(); 
     loadPage(); 
    } 
    window.onload = ignite; 
});

來源

2014-04-27 15:36:41 aimadnet

嘗試添加data-collapsed="false"屬性加時賽您的包裝。

變化：

items+= "<div data-role='collapsible' id='item"+item.id+"'>";

要：

items+= "<div data-collapsed="false" data-role='collapsible' id='item"+item.id+"'>";

見Docs

來源

2014-04-27 16:35:31

jquery手機更新無需重寫

回答

相關問題