功能僅一次

Question

我在jQuery的新的，這裏是我的問題：

我有一個觸發動畫（旋轉木馬），並執行以下功能：前

• 插入一個div默認DIV（類=「模板」）與 所需內容
• 動畫處理的兩個div和帶來新的div inview
• 移除舊的div及其內容

該功能僅適用於第一次。 我懷疑jquery不能識別剩餘的div，即使它與舊的div有相同的類。 我如何告訴jQuery抓住新的div並執行相同的任務？

的功能是通過AJAX與ID = 「ajax_content」

這裏一個div加載一個頁面的工作原理是HTML：

<div id="prev" class="pers_arrow"></div> <!-- Left Arrow --> 

<div id="pers_content"> 

<div id="template_container" class="cur_temp"> <!-- Template Container (850px or 1700px width) --> 



    <div class="template"> <!-- The div that holds the default content, after the function execution is removed and replased from the new div with the same class --> 
     <div id="template_loading"></div> <!-- Loading template icon --> 
     <div id="pers_image"> 
      <img src="images/user.png" alt="" /> 
     </div> 
     <div id="pers_details"> 
      <h1>Μερκούρης Καραγιάννης</h1> 
      <p> 
      Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
      </p>    
     </div> 
    </div> 

</div> 

這裏劇本：

var ajax_content = $('#ajax_content'); 
var prev = $('#prev'); 
var pers_arrow = $('.pers_arrow'); 

var temp = function() { 
    var ajax_content = $('#ajax_content'); 
    var prev = $('#prev'); 
    var template_loading = $('#template_loading'); 
    var template_container = $('#template_container'); 
    var template = $('.template'); 
     var first_temp = template.filter(':first'); 
     var last_temp = template.filter(':last'); 

    var htmlEx = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer in mattis elit. Aliquam egestas justo aliquet risus tempus porttitor. Vivamus vel ultricies dolor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer in mattis elit. Aliquam egestas justo aliquet risus tempus porttitor. Vivamus vel ultricies dolor."; 

    template_loading 
     .fadeIn() 
     .queue(function() { 
      template_container.attr('class', 'cur_prev')   
      template.before('<div class="template">' + htmlEx + '</div>') 
       .queue(function() { 
        template_container.animate({"margin-left" : "0"}, 400, 'easeOutExpo') 
         .queue(function() { 
          template_loading.fadeOut(); 
          last_temp.remove(); 
          template_container.attr('class', 'cur_temp');         
          $(this).dequeue(); 
         }); 
        $(this).dequeue(); 
       }); 
      $(this).dequeue(); 
     }); 
}; 

ajax_content.on("click", prev, temp); 

Answer 1

您應該委託事件處理到另一個元件

$(document).on("click", prev, temp);