поместить HTML-меню (сценарий) в отдельный файл - PullRequest
Новая
       1

поместить HTML-меню (сценарий) в отдельный файл

1 голос
/ 14 октября 2011

У меня есть меню, которое я создал с помощью jquery, которое «всплывает» при наведении мыши на определенные кнопки.

у него МНОГО опций и опций подменю, и я бы хотелпоместите его в отдельный файл, чтобы его нужно было загрузить только один раз, а разметку html и текст не нужно повторно загружать каждый раз, когда пользователь заходит на подстраницу на моем сайте.

Я возился с идеей использования движка шаблонов jquery, но не мог понять, как лучше всего это сделать.В конце концов, это не шаблон, а статическое меню.

Я почти уверен, что не могу поместить его в файл JS, потому что это не скрипт как таковой, это фактическая разметка HTML (в основном таблицы).

Есть идеи?

Ответы [ 4 ]

0 голосов
/ 14 октября 2011

Таким образом, в заключение, это будет единственный способ кэшировать меню индивидуально (или любые отдельные элементы HTML), но имейте в виду, что при первом посещении вашего сайта пользователь сгенерирует дополнительный http-запрос, который может не стоить 50 КБ вы экономите по сравнению с использованием сторонних включений или php include()

$(function(){
    $("#menuholder").html("all the menu markup goes in here");
}) <!-- inside menu.js


<script src="menu.js"></script>


<div id="menuholder"></div>
0 голосов
/ 14 октября 2011

Это может быть слишком много, но для ваших html-страниц задан тип XHTML 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

и, используя вместо этого расширение файла php («index.php» вместо «index.html»), вы сможете использовать 

<?php include("scriptedmenufile.php"); ?>

вместо длинного кода меню. Затем внутри "scriptedmenufile.php" вы разместите HTML-код для вашего меню.

0 голосов
/ 14 октября 2011

Я бы добавил это в скрытый раздел внизу вашей страницы.Затем, когда вы хотите, чтобы оно «всплыло», я бы использовал диалоговое окно jquery ui http://jqueryui.it/demos/dialog для этого скрытого элемента div, чтобы открыть его в диалоговом окне.

Если вы хотите, чтобы это было в отдельном файле, вы могли быиспользовать шаблон на стороне сервера и скрыть его в нижней части главной html-страницы

0 голосов
/ 14 октября 2011

не совсем уверен, что вы имеете в виду, но я склонен включать html для всех «всплывающих окон» в исходную разметку страницы и просто переключать display на none или block с любым событием JQuery, которое выхотите, например 

$("button#popupbtn").click(function(){$("#hiddencontent").css("display", "block")});

Таким образом, вам не нужно загружать разметку каждый раз, как если бы вы использовали Ajax, и вы получаете преимущества SEO от того, что находится в дополнительной разметке.

Если вы решили использовать Ajax, вы также можете предотвратить повторную загрузку, кэшируя результаты (в основном сохраняя локальную копию для повторного использования) после их загрузки, но в действительности это не будет необходимо, поскольку 1-й метод проще илучше для SEO

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...