Как подключить скрипт после загрузки ajax?

Question

[Иван Сохин]

У меня есть кнопка, после нажатия которой должен вылетать слайдер "карусель", но по понятным причинам работать он не хочет, так как ajax скрипты не подгружает. У меня скрипт для слайдера типа:

var slider = {
	done: function() {
           #code
        }
}

Как мне запустить эту функцию после того как я нажал на кнопку и контент подгрузился в ajax? Где использовать slider.done()? или я что то не так делаю?

Answer 1

[Pretor DH]

jQuery.getScript()
Делает запрос к серверу без перезагрузки страницы, с запросом javascript файла. При получении запрошенного файла, код внутри него будет автоматически выполнен. Метод имеет параметры:
jQuery.getScript(url, [success(data, textStatus)]):XMLHttpRequestv:1.0
url — url-адрес js-файла.
success(data, textStatus) — пользовательская функция, которая будет вызвана после удачного выполнения загруженного js-файла.

data — данные, присланные с сервера.
textStatus — статус того, как был выполнен запрос.
Примеры

Запросим у сервера файл "test.js", который будет автоматически выполнен, как только загрузится:
$.getScript("test.js");

Загрузим файл и выведем сообщение, после его удачного выполнения:

$.getScript("test.js", function(){
   alert("Скрипт выполнен.");
 });

Comments

[Иван Сохин]

теперь это выглядит так, но ничего не работает, точнее ajax запрос работает, а скрипт не подгружается

<script type="text/javascript">
			$(document).ready(function(){
				$("img#season").click(function(){
					var season = $(this).attr('alt');
					var showid = "<?=$_GET['showid']?>";
					$.ajax({
						type: "GET",
						url: "season.php",
						data: {"season": season, "showid": showid},
						cache: false,                                 
						success: function(response){
							$("#episodes").html(response);												
						}
					});
					$.getScript("../js/slider.js", function(){
						alert("Скрипт выполнен.");
					});	
					
				return false;
				});
			});
			</script>

[Pretor DH]

А этот кусок случайно не в теле HTML документа. Если да то подозреваю что путь к подгружаемому скрипту неправильный... Смотри в консоль и вкладку DevTools/Network...

[Иван Сохин]

Pretor DH: может дело в подключаемом скрипте? я сделал так:

<script type="text/javascript">
			$(document).ready(function(){
				$("img#season").click(function(){
					var season = $(this).attr('alt');
					var showid = "<?=$_GET['showid']?>";
					$.ajax({
						type: "GET",
						url: "season.php",
						data: {"season": season, "showid": showid},
						cache: false,                                 
						success: function(response){
							$("#episodes").html(response);
							$.getScript("../js/slider.js", function(){
								alert("Скрипт выполнен.");
							});												
						}
					});				
					
				return false;
				});
			});
			</script>

и теперь выводит alert('hello'); из подключаемого скрипта, а сам скрипт не выполняет:

alert('hello');
		var container = $(".my-track");
		var track = container.find(".slider-container").silverTrack({
			perPage: 4,
			autoHeight: true,
		});

		// install the plugins you want, in our case Navigator
		track.install(new SilverTrack.Plugins.Navigator({
			prev: $("a.prev", container),
			next: $("a.next", container)
		}));

		track.start();
		track.goToPage(2);

[Pretor DH]

Значит дело в скрипте... alert выполнился, что-то дальше нет... естественно нет и события success.

[Иван Сохин]

Pretor DH: но это рабочий скрипт, если его просто вставить на страницу с тем html то все работает, тут дело в подключении

[Pretor DH]

alert выполнился значит скрипт загрузился... Может silverTrack грузится асинхронно и еще не успел загрузится. Удостоверься в доступности silverTrack...

[Иван Сохин]

Pretor DH: а как проверить доступность?

Answer 2

[Иван Сохин]

вроде как сделал, но при переключении из одного слайдера в другой скрипт бывает не срабатывает, как будто конфликтует сам с собой, что делать?

Comments

[Иван Сохин]

насколько я понял, скрипт просто не успевает загрузится, поэтому и пролагивается, а как сделать что бы наверняка скрипт подгружался вовремя?

[Pretor DH]

Я про это тебе и писал... Где ты подключаешь silverTrack...
Поставь подключение в head - сразу за jquery... и вешай событие не на $(document).ready( а на $(window).load(

[Pretor DH]

Событие $(document).ready( срабатывает сразу как создался обьект DOM BODY и не ждет пока загрузится все остальное - скрипты, картинки...

[Иван Сохин]

Pretor DH: с этим я разобрался) теперь хочу сделать чтобы контент отображался после полной загрузки с прелоадером, как это сделать?

[Pretor DH]

Ставишь блок перекрывающий все и отображающий шкалу прелоадера. А на событите $(window).load(вешаеш его убирание. На загрузку onload скриптов и картинок ставь увеличение шкалы прелоадера.