1

В процессе разработки столкнулся с проблемой интеграции javascript-a для виджетов в ajax-приложении. Использую библиотеку html5-history-api.

Вот кусок кода:

               $("a").live('click', function() {

                    history.pushState( null, null, this.href );
                    var urlReq = this.href;
                    $.post(
                        urlReq,
                        {},
                        function(data){

                            var content = $("#content");
                            $("title").text(data.module.title);
                            content.html(data.module.content);
                        },
                        'json'
                    );
                    return false;
                });

Этот код лоадит основной контент на страницу. И соль собственно вот в чем:

При не ajax запросе сервер выдает всю страницу целиком, в т.ч. и <script src=""></script>. При переходе с одной страницы приложения на другую меняется контент модуля, а также должны подгружаться другие виджеты. Например, модуль текстовой страницы выводит содержимое главной страницы и справа виджет новостей крутится. Когда осуществляется переход на "новости" модуль публикаций грузит новости, а виджет новостей на этой странице не нужен. Так вот. Если взять оборатную ситуацию. Загружена страница новостей -> клик по главной -> грузится текст главной + надо подгрузить виджет, который за собой тянет js-файлы. Есть метод:

function addScript(src){
    var newScript = document.createElement("script");
    newScript.src = src;
    newScript.type = "text/javascript";
    document.getElementsByTagName("head")[0].appendChild(newScript);
}

И наконец таки вопрос:

Будет ли являться хорошей реализацией следующая схема:

На каждой странице подключить скрипт addScript(src) и при ajax-запросе выполнять чтото типа этого:

          $("a").live('click', function() {

                history.pushState( null, null, this.href );
                var urlReq = this.href;
                $.post(
                    urlReq,
                    {},
                    function(data){

                        var content = $("#content");
                        $("title").text(data.module.title);
                        content.html(data.module.content);
                        for (var widget in data.widgets){
                            for(wScript in widget.scripts)
                                 addScript(wScript);
                        }
                    },
                    'json'
                );
                return false;
            });

И вообще addScript() будет видна в function(data){} ?

3
  • неужели все уже праздник отмечают и никто не желает ответить? за здравые советы/рекомендации/критику дарю 100 очков маны. 4 мая 2012 в 5:06
  • 2
    ИМХО - если делаешь "одностраничный" сайт - сливай весь JS воедино. В принципе - можно использовать нечто подобное, но для этого нужно иметь независимые друг от друга модули и реализовать кэширование (т.е. завести массив путей уже загруженых скриптов и подключать новый только если его нет в этом списке). Собственно вопрос - будет ли хорошей такая реализация, ответ очевиден - нет. Сколько раз пользователь будет клацать назад вперед - столько раз будут подгружаться и апендится в DOM новые скрипты, а это уныло
    – user3545
    5 мая 2012 в 11:27
  • Система сложная. Скрипты коннектятся только те, которые нужны. Что каждый раз все по новой грузиться будет - это уже не так. Сейчас у меня реализован синглтон с массивом состояний. Как допилю, приведу код т.с. на одобрение сообщества. Просто с js работать приходилось по работе крайне мало. Сейчас над своим проектом работаю - приходится вспоминать.. 5 мая 2012 в 11:48

1 ответ 1

1

Так у вас при каждом запросе будут создаваться новые теги скрипт, зачем? а старые остаются или удаляются? нужно скрипт подгрузить один раз и потом только вызывать его функции чтобы обновить виджет, тегу скрипт еще нужно добавить атрибут async = true, чтобы браузер грузил все сразу а не ждал пока загрузится каждый скрипт по очереди и событие onload по которому сработает запуск виджета. addScript(src) будет видна function(data)? смотря где ее объявить

1
  • объявлена в глобаной области видимости. Либо, что скорей всего я сделаю, объявлю его как метод объекта, который будет создан в единственном экземпляре. Синглтон вообщем будет. 5 мая 2012 в 10:50

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.