修改DOM後如何確保DOM已準備好再次

我們首先做代碼：修改DOM後如何確保DOM已準備好再次

$(function(){ 

    //Step-2) Load and a template from server and APPEND to BODY 
    function loadTemplate(path, callback) { 
     $.get(path, null, function (t) { 
      $('body').append(t); 
     }, 'text'); 

     if (callback != undefined && typeof (callback) == 'function') { 
      callback.apply(window); 
     } 
    } 

    //Step-3) a callback method 
    function showProduct() { 
     //setTimeout(function() { 
     // $('#prodBasicView').tmpl(prod).appendTo('#prodView'); 
     //}, 100); 

     alert($('#prodBasicView').length); // it alerts 0, But I am expecting 1 

    } 

    //Step-1) initiating loading template 
    loadTemplate('/template/remote-template2.htm', showProduct); 
});

遠程template2.htm： -

 <div id="prodBasicView" style="display:none;"> 
     <div class="myProd"> 
     <h3> Product Name</h3> 
      <span>Price: $ 700 </span> 
     </div> 
    </div>

問題：

loadTemplate方法成功加載模板（remote-template2.htm）並追加到body。
成功加載模板後，傳遞迴調函數showProduct方法被解僱。
Inside showProduct method我試圖使用加載的模板（$（'＃prodBasicView'）），但它返回空數組。
但如果我耽誤顯示產品很少毫秒的執行它的工作原理，但我不認爲這是一個很好的做法
上述觀點似乎是追加的DOM元素都沒有準備好
如何在使用前修改DOM/MANIPULATED DOM？

來源

2012-08-09 Premchandra Singh

在我看來，你只是需要把回調調用代碼$.get回調中，像這樣：

function loadTemplate(path, callback) { 
    $.get(path, null, function (t) { 
     $('body').append(t); 
     if (callback != undefined && typeof (callback) == 'function') { 
      callback.apply(window); 
     } 
    }, 'text'); 
}

來源

2012-08-09 05:10:48 KRyan

是回調從'$ .get'回調使用JavaScript的應用** **方法 – 2012-08-09 05:16:47

@LPremchandra調用：我怕我不明白您的評論。我提供的代碼有問題嗎？在你原來的代碼中，'if（callback！='...行在$ .get'函數的回調之外;通過將它放在裏面，我確保它不會被調用，直到回調函數完成（也就是說，在'$（'body'）。append（t）;'call）之後。 – KRyan 2012-08-09 05:19:39

:) Thanks Dragoon Wraith。我在想，我的回調是在'$ .get'回調中。這是我的代碼中的錯誤，但理解是正確的。 **非常感謝** – 2012-08-09 05:26:04

執行您callback在AJAX回調處理程序。（因爲Ajax的工作原理異步）

function loadTemplate(path, callback) { 
     $.get(path, null, function (t) { 
      $('body').append(t); 
      if (callback != undefined && typeof (callback) == 'function') { 
       callback.apply(window); 
      } 
     }, 'text'); 
    }

來源

2012-08-09 05:11:11 xdazz

我的實際回調方法** showProduct **正在通過將其傳遞到** loadTemplate **方法中，從ajax回調處理程序中調用 – 2012-08-09 05:19:21

@LPremchandra是嗎？檢查代碼，看看有什麼不同？ – xdazz 2012-08-09 05:22:23

我的代碼中有一個錯誤。感謝它應該在Ajax回調 – 2012-08-09 05:27:04

修改DOM後如何確保DOM已準備好再次

回答

相關問題