Я сделал несколько подходов до сих пор в проектах с более чем 50 страницами, и они оба хорошо масштабируются. Я не использовал backbone.js, но подходы прямолинейны и не требуют рамки для изучения, кроме того, что я использовал jQuery для селекторов.
У обоих из них есть общее создание одного окна оверлея, которое вы можете вытащить в содержимое. Я написал с нуля, но вы можете легко использовать диалог jQuery UI. Эти два подхода отличаются только тем, как растягивается контент. Кроме того, использование информации о ссылке - все, что вам нужно, чтобы вы вставляете «модуль» или оверлейный контент в качестве своего правила. Не нужно загружать тонны скриптов, чтобы запустить приложение. Попросите модули потянуть за поведение.
Вариант 1) Используйте метод загрузки JQuery, чтобы тянуть контент из автономных веб-страниц, используя переменный-заполнитель так:
var $ph = $('<div />');
$ph.load(URL); // loads gui of remote URL + executes any script that URL has
в $ фот вар теперь содержит все GUI, загруженные в от внешнего URL, чтобы вы могли использовать селектор, чтобы извлечь конкретный HTML-код и поместить его в свой DOM или наложить по мере необходимости.
Вот пример автономного HTML выход:
<div class="module">
<a class="link">click me</a>
</div>
<script>
(function(){
// put any private vars here
$('.module .link').click(function(){
// do something
});
})();
</script>
Если удалить() или уничтожить РОМ внутри накладкой через JQuery, он автоматически удалит все события, непосредственно назначенные ака «привязывать »и« отвязать »их, но используя« живые »или« делегаты », вам нужно будет беспокоиться о« умереть »и« не делить »и т. д. просто делать die (« namespace »). live ('click.namespace') будет обеспечивать очищается.
Вот пример этого на одном из моих сайтов ->http://www.kitgui.com/docs Но лучший пример находится в разделе клиента, поскольку документы довольно просты, используя историю хэша.
2) Использование iframe внутри вашего наложения и присвоение ему URL-адреса.
Это самый простой вариант, но он немного медленнее, потому что каждая страница должна иметь полное автономное поведение и зависимости от iframe. Также вы должны беспокоиться о калибровке рамки и т. Д., Если у вас нет фиксированного окна оверлея.
У вас должен быть навесщик, накладывающий ваш iframe во время его загрузки, а затем iframe поговорить с родителем, чтобы сообщить ему о своей загрузке и скрыть загрузчик.
Я сделал это несколько сайтов, но один из них является сайт в разработке вы можете увидеть здесь, чтобы получить код ->
http://dev.zipstory.com (войдите и пойти в мой zipstory и нажмите кнопку «группы» настройки и т.д. для см. это, просто просмотрите источник, чтобы увидеть, как я это сделал, поскольку все его там)
Что касается iframe, вы должны написать код родителя, который принимает стандартные сообщения из iframe, которые вы согласитесь, как типичный набор поведение, например уведомление о завершении загрузки или передачи сообщений, чтобы что-то обновить на родительском устройстве и т. д. Это может быть добавлено «на лету» и реорганизовано по мере необходимости, пока ваша цель - подход KISS.
Вы задаете невероятно широкий вопрос. Вам лучше читать некоторые книги/статьи на эту тему, создавать некоторые прототипы, а затем переоценивать то, что вам нужно знать от сообщества. – Stephen
@Stephen полностью согласен с его невероятным широким .. я бы по достоинству оценил некоторые указатели .. как я только что узнал о https://github.com/derickbailey/backbone.marionette и может быть какой-то плагин, подобный этому, который был бы полезен – codeAnand