Не работает JavaScript в модальном окне
Народ, приветствую всех.
Проблема такова, есть модальное окно на главной странице, при открытии его, в него подгружается другая отдельная страница с данными. И после загрузки в модальном окне не работают js скрипты вообще. Я склоняюсь к тому, что возможно происходит конфликт скриптов, так как и на главной и на другой странице одинаковые скрипты. НО при просмотре в консоле FireBug ошибок/конфликтов вообще нет, пишет только GET загруженной страницы. Но при удалении схожих скриптов на другой странице, нужный скрипт который я оставляю также не работает. Не пойму в чем проблема... Как сделать так, чтобы в вызванной странице в модальном окне работали скрипты? Заранее благодарен. |
А скрипты на jquery или нативном?
|
на jQuery в основном, но есть отдельные скрипты и на нативном, комбинированные.
Скрипт который вызывает модальное окно с подгрузкой страницы, то он на jQuery. |
Думаю в модальном окне не подключена библиотека jquery, подключите и все заработает.
|
Цитата:
Вот сам код вызова окна: $(window).load(function() { (function(){ var container = $( "#modal-body" ); var $items = $('.open-project-link'); index = $items.length; $('.open-project-link').click(function(){ $('#modal-body').addClass('modal-active'); if ($(this).hasClass('active')){ } else { lastIndex = index; index = $(this).index(); $items.removeClass('active'); $(this).addClass('active'); var myUrl = $(this).find('.open-project').attr("href") + " .tover_view_page"; $('#tovar_content').animate({opacity:0},function(){ $("#tovar_content").load(myUrl,function(e){ //Tovar View Carousel $('#carousel1').flexslider({ animation: "slide", controlNav: false, directionNav: false, animationLoop: false, slideshow: false, direction: "vertical", asNavFor: '#slider1' }); $('#slider1').flexslider({ animation: "fade", controlNav: false, directionNav: false, animationLoop: false, slideshow: false, sync: "#carousel1" }); jQuery('#carousel1 .slides li').click(function(){ $('#carousel1 .slides li').removeClass('flex-active-slide'); $(this).addClass('flex-active-slide'); return false; }); //fancySelect $('.basic').fancySelect(); }); $('#tovar_content').animate({opacity:1}); }); //Project Page Open $('#modal-body').show(function(){ $('#tovar_content');}).show(2000,function(){ $('.element_fade_in').each(function (){ $(this).appear(function(){ $(this).delay(100).animate({opacity:1,right:"0px"},1000); }); }); }); } return false; }); //Project Page Close $(document).on('click', '#tover_view_page_close, .close_block', function(event) { $('#tovar_content').animate({opacity:0}, 400,function(){ $('#modal-body').removeClass('modal-active').hide(400); }); $items.removeClass('active'); return false; }); })(); }); Кстати, если подключить любой js код в вызываемой странице и вызываемом блоке, то при вызове страницы этот js код абсолютно весь пропадает со страницы. |
Добавил в код вызова модального окна, код вызова своего скрипта из вне:
....}); $.getScript('http://example.com/script.js', function(){ alert('script loaded'); }); jQuery('#carousel1.... В принципе мой скрипт заработал как надо, функционирует все в модальном окне. И jQuery подключать никуда не надо. Но остается НО, не добавлять же так каждую библиотеку или скрипт таким методом, чтобы все работало, потому что на странице очень много разных скриптов. Как можно более ловко и правильно исправить данную ситуацию, чтобы не загружать все эти скрипты при каждом клике, потому что их будет очень много? |
Часовой пояс GMT +3, время: 12:35. |