用ajax加载框架

Question

我想用ajax加载html。但我有问题。当你点击按钮。我加载jquery加载，在容器中的HTML。容器是.project-detail。我希望容器是从上到下的动画。但问题。我第一次点击按钮。它不工作。当我第二次点击时，它正在工作。我错了什么？

function projectDetails() { 
    var button = $(".list-portfolio"), 
     slide = $(".project-detail"); 

    button.click(function(e){ 
     e.preventDefault(); 

     $(".project-detail").load("includes/ruimzicht.html"); 

     var height = $(".project-detail .column").outerHeight(); 
     slide.animate({height: height},600); 

     $(".project-detail .column").css({ opacity: 0.5 }); 
    }); 
} 

Answer 1

您需要等到ajax加载内容。我认为这个代码应该可以工作，

function projectDetails() { 
    var button = $(".list-portfolio"), 
     slide = $(".project-detail"); 

    button.click(function(e){ 
     e.preventDefault(); 

     $(".project-detail").load("includes/ruimzicht.html", function() { 
      var height = $(".project-detail .column").outerHeight(); 
      slide.animate({height: height},600); 

      $(".project-detail .column").css({ opacity: 0.5 }); 
     });   
    }); 
}