JQuery загружает контент, не работает с другими скриптами - PullRequest
Новая
       18

JQuery загружает контент, не работает с другими скриптами

0 голосов
/ 07 марта 2011

Я начинающий пользователь jquery, поэтому я очень надеюсь, что это будет довольно просто для кого-то с небольшим опытом. Недавно я реализовал скрипт jquery, который загружает содержимое для div с другой html-страницы. Это прекрасно работает, и я очень доволен результатом. Теперь у меня проблема в том, что мои скрипты Lytebox и Flexcroll не будут работать с загруженным контентом. Ниже приведен скрипт загрузки контента. Я думал, что могу просто добавить 

fleXenv.initByClass("flexcroll"); 
initLytebox();

до конца скрипта. Это не работает, когда контент загружается в первый раз. Но если я щелкну по неработающей ссылке на странице и он снова запустит этот сценарий, то включатся сценарии Lytebox и Flexcroll. Мне нужно знать, когда и как обновить сценарии Lytebox и Flexcroll 

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

var toLoad = $(this).attr('href')+' #content';  
$('#content').fadeOut('400',loadContent);  
$('#load').remove();  
$('#wrapper').append('<span id="load">LOADING...</span>');  
$('#load').fadeIn('normal');  
function loadContent() {  
    $('#content').load(toLoad,'',showNewContent()); 
}  
function showNewContent() {  
    $('#content').fadeIn('400',hideLoader());  
}   
function hideLoader() {  
    $('#load').fadeOut('normal');  
}  
return false;  
}); 


});

Любая помощь будет высоко ценится. Я в настоящее время нахожусь на дне 3-дневной ямы отчаяния. Dreamweaver дурачит меня!

Ответы [ 3 ]

2 голосов
/ 08 марта 2011

Sussed это!Для тех, кто страдает от этого, как у меня в течение последних 3 дней.Вот мое исправление:

Я создал новый скрипт в заголовке html: 

$(document).ajaxComplete(function(){     
// fire when any Ajax requests complete })

И затем сказал всем скриптам инициализироваться в этом скрипте.

0 голосов
/ 07 марта 2011

Вы не можете просто добавить их в конец скрипта, потому что загрузка происходит асинхронно . Другими словами, к моменту возврата вашей функции click ничего еще не было загружено; это происходит в фоновом режиме, и ваша функция обратного вызова showNewContent вызывается после того, как это сделано.

Я предполагаю, что вы также хотите выполнить инициализацию в этой функции: 

function showNewContent() {  
    fleXenv.initByClass("flexcroll");
    initLytebox();
    $('#content').fadeIn('400',hideLoader());  
}

Также вместо этого: 

$('#content').load(toLoad,'',showNewContent());

напишите это: 

$('#content').load(toLoad,'',showNewContent);

Вместо вызова функции showNewContent и передачи ее результата в функцию load вы хотите передать самой функции showNewContent в load. Вы можете сделать это, потому что в JavaScript все является объектом.

То же самое относится и к hideLoader.

Также, я думаю, здесь слишком много места в кавычках: 

var toLoad = $(this).attr('href')+' #content';
0 голосов
/ 07 марта 2011

Похоже, они конфликтуют из-за использования тех же селекторов. Это также может произойти, если в заголовке страницы указан неверный порядок ссылок на скрипты.

Попробуйте использовать метод JQuery noconflict;

http://api.jquery.com/jQuery.noConflict/

Если это не сработает, переопределите функцию $. Инструкции здесь;

http://docs.jquery.com/Using_jQuery_with_Other_Libraries

Надеюсь, это поможет.

...