Jquery: запустить скрипт после ajax load ()

Я использую функцию load () для динамического извлечения деталей с разных страниц, нажимая на кнопки в меню. Одна из кнопок указывает на галерею изображений, которая использует свои собственные эффекты jquery. Но эти сценарии не работают. Я пытался загрузить их явно с помощью getscript (), но это тоже не работает. Вот's код:

$(document).ready(function() {

var hash = window.location.hash.substr(1);
var href = $('#nav li a').each(function(){
    var href = $(this).attr('href');
    if((hash==href.substr(0,href.length-4))&&(hash!='')){
        var toLoad = hash+'.php #content';
        $('#content').load(toLoad);
    }                                           
});

$('#nav li a').click(function(){

    var toLoad = $(this).attr('href')+' #content';
    $('#content').hide();   
    window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-4);
    $('#content').load(toLoad,showNewContent());
    function showNewContent() {
        $('#content').fadeIn(1000);
        $.getScript("gallery.js");
    }

    return false;

});

});

Вот's содержимое моего файла gallery.js. Точный эффект может быть неактуальным, я вставил ниже код, чтобы показать расположение моих предупреждений:

$(document).ready(function(){
//perform actions when DOM is ready
  var z = 0; //for setting the initial z-index's
  var inAnimation = false; //flag for testing if we are in a animation
  alert("1");
  $('#pictures img').each(function() { //set the initial z-index's    
    z++; //at the end we have the highest z-index value stored in the z variable
    $(this).css('z-index', z); //apply increased z-index to <img>
    alert("2");
  });

  function swapFirstLast(isFirst) {
    if(inAnimation) return false; //if already swapping pictures just return
    else inAnimation = true; //set the flag that we process a image
    var processZindex, direction, newZindex, inDeCrease; //change for previous or next image
    alert("3");
    if(isFirst) { processZindex = z; direction = '-'; newZindex = 1; inDeCrease = 1; } //set variables for "next" action
    else { processZindex = 1; direction = ''; newZindex = z; inDeCrease = -1; } //set variables for "previous" action

    $('#pictures img').each(function() { //process each image
    alert("4");
          if($(this).css('z-index') == processZindex) { //if its the image we need to process
        $(this).animate({ 'top' : direction + $(this).height() + 'px' }, 'slow', function() { //animate the img above/under the gallery (assuming all pictures are equal height)
          $(this).css('z-index', newZindex) //set new z-index
            .animate({ 'top' : '0' }, 'slow', function() { //animate the image back to its original position
              inAnimation = false; //reset the flag
            });
        });
      } else { //not the image we need to process, only in/de-crease z-index
        $(this).animate({ 'top' : '0' }, 'slow', function() { //make sure to wait swapping the z-index when image is above/under the gallery
          $(this).css('z-index', parseInt($(this).css('z-index')) + inDeCrease); //in/de-crease the z-index by one
        });
      }
    });

    return false; //don't follow the clicked link
  }

  $('#next1 a').click(function() {
      alert("5");
    return swapFirstLast(true); //swap first image to last position
  });

  $('#prev1 a').click(function() {
      alert("6");
    return swapFirstLast(false); //swap last image to first position
  });

});
//Function for z-index based gallery ends here

Вот'Что я нашел:

Я делаю Ctrl + F5 и загружаю страницу с самого начала, и нажимаю кнопку галереи. Я получаю оповещение "1", Изображения загружаются, но анимация не работает.

Я снова нажимаю на кнопку галереи, без обновления, и я получаю все соответствующие предупреждения от 1 до 6, и эффект работает как шарм.

Когда эффект не работает, я просто помещаю содержимое gallery.js в chrome-console и нажимаю enter, и эффект снова работает отлично.

Кроме того, бывают случаи, когда эффекты не работают, несмотря на точное повторение вышеуказанных шагов. В чем может быть проблема здесь? Я слышал, что метод getscript является асинхронным, и я даже пытался отключить синхронизацию ajax, но все равно получаю непредсказуемые результаты.

 zb'08 окт. 2012 г., 01:08
используйте success: funcion () callback для вызова вещей после загрузки скрипта

Ответы на вопрос(2)

Решение Вопроса

что несмотря на звонкиgetScript () как обратный вызовнагрузка ()Сценарий загрузкидо' содержание могло портить поток. Вместо звонкаshowNewContent () в качестве обратного вызова мне нужно было позвонитьshowNewContent то есть указатель на функцию (без круглых скобок), чтобы она ожидала завершения загрузки. Следующий код разрешил это:

$('#content').load(toLoad,showNewContent);
    function showNewContent() {
        $('#content').fadeIn(1000);
        $.getScript("gallery.js");
}
 RevConcept12 мар. 2013 г., 19:41
Браслеты! Спасибо большое.

В вашей галерее JS заменить

$(document).ready(function(){

с

MyGallery=function(){

В основном скрипте:

var MyGallery=function();
$(document).ready(function() {

....

....

  function showNewContent() {
        $('#content').fadeIn(1000);
        $.getScript("gallery.js",{success: MyGallery});
    }

....

....

Я не уверен, что заставило вас делать такие вещи, лучше рассмотрим идею потока кода ....

Ваш ответ на вопрос