jQuery的功能停止与页面加载与AJAX

Question

这是我第一次尝试做一些加载页面与AJAX的东西。

这是工作正常几页，但与幻灯片或另一个jquery函数，脚本停止工作，我看到一些关于我需要再次调用函数，但我不知道我的代码是在哪里正确的地方，就像我需要调用加载页面。

有我的JavaScript代码

$(document).ready(function(){ 
preload([ 
'/img/bg_body_topo.jpg', 
'/img/img_topo.png', 
'/img/logo_topo.png' 
]); 

$("a[rel*=outside]").attr("target", "_blank"); 
$('#scrollbar').tinyscrollbar({ sizethumb: 55 }); 
$('#menu-topo ul li ul').hide(); 
$('#menu-topo ul li').hover(function(e) { 
$(this).find('ul').stop().fadeToggle("fast"); 
}); 

$("#home-slide-destaques").scrollable({ circular: true }).autoscroll({ autoplay: true  }).navigator(".controles");   
    // DISCOGRAFIA 
    $("ul#int-abas-discografia").tabs("div#int-conteudo-discografia > div", { effect: 'fade' }); 
    // INTEGRANTES 
    $("ul#int-abas-integrantes").tabs("div#int-conteudo-integrantes > div", { effect: 'fade' }); 


var content = $('#content'); 
//pre carregando o gif 
    loading = new Image(); loading.src = '/img/103.gif'; 
    $('#menu-topo a, a#menu-ajax').live('click', function(e){ 
     e.preventDefault(); 

       var tHeight = $('#wrapper').height(); 
       var tWidth = $('#wrapper').width(); 
       var posicao = $('#wrapper').position(); 

       $('#carregando').remove(); 
       $('#imgcarregando').remove(); 

       $('#wrapper').prepend('<div id="carregando"></div> <div id="imgcarregando"> <img src="/img/103.gif" style="margin:280px 0 0 0;" alt="Carregando"/></div>'); 

       $('#carregando').css({ 
        'position': 'absolute', 
        'width': tWidth, 
        'height': tHeight, 
        'top': posicao.top, 
        'left': posicao.left, 
        'background': '#000', 
        'opacity': '.60', 
        'z-index': '9900', 
        'text-align': 'center' 
       }); 


       $('#imgcarregando').css({ 
        'position': 'absolute', 
        'width': tWidth, 
        'height': tHeight, 
        'top': posicao.top, 
        'left': posicao.left, 
        'background': '#000 url(/img/logo_topo.png) center 200px no-repeat', 
        'padding': '30px 0 0 0 ', 
        'opacity': '.88', 
        'z-index': '9999', 
        'text-align': 'center' 
       }); 


        content.html(''); 


     var href = $(this).attr('href'); 
     $.ajax({ 
      url: href, 
      success: function(response){ 
       //forçando o parser 
      var data = $('<div>'+response+'</div>').find('#content').html(); 

       //apenas atrasando a troca, para mostrarmos o loading 
       window.setTimeout(function(){ 
        content.fadeOut('slow', function(){ 

         $('#carregando').fadeOut('slow'); 
         $('#imgcarregando').fadeOut('slow'); 
         $('#content').height('auto'); 
          // DESTAQUES 

         content.html(data).fadeIn(); 

        }); 
       }, 1000); 
      } 
     }); 

    });       

}); 

    function preload(arrayOfImages) { 
    $(arrayOfImages).each(function(){ 
    $('<img/>')[0].src = this; 
    // Alternatively you could use: 
    // (new Image()).src = this; 
    }); 
     } 

Answer 1

前几天也有类似的问题，管理与ajaxComplete，被执行来解决这个问题，每次一个Ajax加载完成

做了类似的东西：

var rebindButtons = function(){ 
    $(elements).unbind('click').click(function(){ 
     // rebinding of button functionality 
    }); 
} 
$(document).ready(function(){ 
    // we bind the buttons for the first time 
    rebindButtons(); 
    // and when there's an ajax call completed we rebind the buttons 
    $(document).ajaxComplete(function() { 
    rebindButtons(); 
    }); 
}) 

Answer 2

我想你是试图加载旧的通常的HTML页面在你新的AJAX页面。当你加载一个新的内容时，你不需要为它加载脚本，因为它之前就在运行，你也需要加载它们。 您可以尝试自己做，通过ajax将适当的脚本插入到新标签中，或者只需在开始时加载所有相关内容的所有相关脚本，或者我建议您在需要时使用require等库来加载它们。 js，已经为它进行了优化。

Answer 3

我不知道这是否是正确的做法，但我做了一些改变和99％的工程现在..

我有CHAGE

$(document).ready(function(){ 

// to 

$(function(){ 

也是我与JavaScript函数

使这

function boxWallpapers(){ 


$("#home-slide-destaques").scrollable({ circular: true }).autoscroll({ autoplay: true }).navigator(".controles");   

    // DISCOGRAFIA 
$("ul#int-abas-discografia").tabs("div#int-conteudo-discografia > div", { effect: 'fade' }); 

    // INTEGRANTES 
$("ul#int-abas-integrantes").tabs("div#int-conteudo-integrantes > div", { effect: 'fade' }); 

$('#menu-topo ul li ul').hide(); 
$('#menu-topo ul li').hover(function(e) { 
    $(this).find('ul').stop().fadeToggle("fast"); 
}); 

    } 

，然后在AJAX

 $.ajax({ 
      url: href, 
      success: function(response){ 
       //forçando o parser 

      var data = $('<div>'+response+'</div>').find('#content').html(); 

       //apenas atrasando a troca, para mostrarmos o loading 
       window.setTimeout(function(){ 
        content.fadeOut('slow', function(){ 

         $('#carregando').fadeOut('slow'); 
         $('#imgcarregando').fadeOut('slow'); 
         $('#content').height('auto'); 


         content.html(data).fadeIn(); 
         boxWallpapers(); // HERE HERE 



        }); 
       }, 1000);