包括对AJAX加载元素现有的jQuery函数jQuery的

Question

我有我的HTML结束一些功能做一些东西，它使用jQuery

function transformacija() { 
    if ($("#drugiPrviPage").hasClass("pocetna")) { 
     $("#drugiPrviPage").velocity({ 
       left: "-100%", 
       opacity: 0.3 
      }, 
      "slow" 
     ) 
     $("#drugiPodPage").velocity({ 
       right: "10%", 
       opacity: 1 
      }, 
      "slow" 
     ) 
    } else { 
     $("#drugiPrviPage").velocity({ 
       left: "10%", 
       opacity: 1 
      }, 
      "slow" 
     ) 
     $("#drugiPodPage").velocity({ 
       right: "-100%", 
       opacity: 0.3 
      }, 
      "slow" 
     ) 
     $("#prviPage").removeClass("pocetna"); 
     $("#drugiPodPage").empty(); 

    } 

} 



$(".prvilinkovi").click(function() { 
    var id = $(this).attr('id'); 
    var idt = id + '.txt'; 
    $(document).ajax({ 
     url: [idt], 
     type: "GET", 
     cache: false, 
     success: function(txt) { 
      $("#drugiPodPage").html(txt); 

     } 
    }); 
    transformacija(); 

}); 
} 

Basicly当我点一下班“prvilinkovi”我用ajax将内容加载到div中，然后我在ajax加载的div上具有相同的按钮，并且我希望它具有与初始单击的按钮相同的功能。我向ajaxloaded按钮添加了类“pocetna”，但它没有像第一个按钮那样的功能。

我怎么能委托的功能工作的Ajax加载的内容？

我试过把代码放到一个init函数中，并在ajaxcomplete事件上调用它，但它似乎根本没有工作（即使我在document.ready（）上也用它来调用init函数。

我去了这个Ajax加载方法，当点击一个带有酷速度动画的类别以便拥有网页的onepage模型，并且当你回到它清空div并为下一个做好准备时。类目点击

Answer 1

好按我的理解，你可以如下做到这一点：

• 保持一个普通的班级，说pocetna两个div - drugiPodPage和drugiPrviPage。
• 将点击事件附加到document或DOM load上的任何最接近的元素。由于pocetna类将在document.ready存在，我们将事件附加到它，委托给下面的按钮：

JS

$('.pocetna').on('click',".prvilinkovi",function() { 
    var id = $(this).attr('id'); 
    var parentID=$(this).closest('.pocetna').attr('id'); //get the button's parent id 
    if(parentID=="drugiPrviPage") //if its previous page perform ajax call 
    { 
     var idt = id + '.txt'; 
     $(document).ajax({ 
       url: [idt], 
       type: "GET", 
       cache: false, 
       success: function(txt) { 
        $("#drugiPodPage").html(txt); 
        //move the divs only on success 
        $("#drugiPrviPage").velocity({ 
         left: "-100%", 
         opacity: 0.3 
        },"slow"); 
        $("#drugiPodPage").velocity({ 
         right: "10%", 
         opacity: 1 
        },"slow"); 
       } 
      }); 
    } 
    else 
    { 
     $("#drugiPrviPage").velocity(
     { 
       left: "10%", 
       opacity: 1 
     },"slow"); 
     $("#drugiPodPage").velocity(
     { 
       right: "-100%", 
       opacity: 0.3 
     },"slow"); 
     $("#drugiPodPage").empty(); 
    } 
});