TToriginal 396 Опубликовано 2 июня, 2018 (изменено) Здравствуйте, уважаемые господа ! Появилась идея создать информационный портал на html и сразу возникла проблема: В дальнейшем хотел бы добавлять категории в меню постепенно, не все сразу, но при большом количестве страниц, это займет много времени, редактировать каждую страницу и не удобно это все будет делать. Создал новый файл menu.html Разместил туда меню В каждой странице прописал код : <div id="menu"></div> <script type="text/javascript"> $(function(){ $('#menu').load('menu.html'); }); </script> Но не работает, возможно я не туда пошел? Возможно какой-то выход? Поместить меню в один файл html и прикрепить его ко всем страницам, чтобы редактировать только его? Изменено 2 июня, 2018 пользователем JoeyTribbiani Поделиться сообщением Ссылка на сообщение Поделиться на другие сайты
TToriginal 396 Опубликовано 2 июня, 2018 30 минут назад, TTOriginal сказал: Здравствуйте, уважаемые господа ! Появилась идея создать информационный портал на html и сразу возникла проблема: В дальнейшем хотел бы добавлять категории в меню постепенно, не все сразу, но при большом количестве страниц, это займет много времени, редактировать каждую страницу и не удобно это все будет делать. Возможно какой-то выход? Поместить меню в один файл html и прикрепить его ко всем страницам, чтобы редактировать только его? Создал menu.js Прописал код : $(function() { $('#loadContent').load('menu.html'); }); Подключил к страницам кодом: <script src="menu.js" type="text/javascript" ></script> Опять что-то не туда Поделиться сообщением Ссылка на сообщение Поделиться на другие сайты
TToriginal 396 Опубликовано 2 июня, 2018 Через iframe : <iframe src="menu.html" seamless></iframe> Просто ставит его сверху, сунул материал вниз Поделиться сообщением Ссылка на сообщение Поделиться на другие сайты
TToriginal 396 Опубликовано 2 июня, 2018 При использовании jQuery: <script> $(function(){ $("#includedContent").load("menu.html"); }); </script> <div id="includedContent"></div> также ничего Поделиться сообщением Ссылка на сообщение Поделиться на другие сайты
zGosu 396 Опубликовано 2 июня, 2018 Тебе без использования PHP? Поделиться сообщением Ссылка на сообщение Поделиться на другие сайты
TToriginal 396 Опубликовано 2 июня, 2018 4 минуты назад, zGosu сказал: Тебе без использования PHP? да) Поделиться сообщением Ссылка на сообщение Поделиться на другие сайты
thetro 4 Опубликовано 2 июня, 2018 (изменено) <script> $(document).ready(function() { $("#includedContent").load("menu.html"); }); </script> Изменено 2 июня, 2018 пользователем thetro 1 Поделиться сообщением Ссылка на сообщение Поделиться на другие сайты
TToriginal 396 Опубликовано 2 июня, 2018 6 минут назад, thetro сказал: <script> $(document).ready(function() { $("#includedContent").load("menu.html"); }); </script> Добавил перед </head> <script> $(document).ready(function() { $("#includedContent").load("menu.html"); }); </script> Добавил в <body> <div id="includedContent"></div> Но к сожалению не работает Поделиться сообщением Ссылка на сообщение Поделиться на другие сайты
thetro 4 Опубликовано 2 июня, 2018 (изменено) На хостинг/open server залить нужно. Ajax не будет работать если просто открываешь html файл в браузере. И jquery подключен? Изменено 2 июня, 2018 пользователем thetro 1 Поделиться сообщением Ссылка на сообщение Поделиться на другие сайты
TToriginal 396 Опубликовано 2 июня, 2018 (изменено) 25 минут назад, thetro сказал: На хостинг/open server залить нужно. Ajax не будет работать если просто открываешь html файл в браузере работает Изменено 2 июня, 2018 пользователем TTOriginal ошибка Поделиться сообщением Ссылка на сообщение Поделиться на другие сайты
zGosu 396 Опубликовано 2 июня, 2018 У меня через AppServer работает этот метод: HTML Include 1 Поделиться сообщением Ссылка на сообщение Поделиться на другие сайты
L2Banners 664 Опубликовано 2 июня, 2018 (изменено) Как вариант: <div id="menu"></div> $(function(){ $("#menu").prepend('<ul><li><a href="#">Пункт 1</a></li><li><a href="#">Пункт 2</a></li><li><a href="#">Пункт 3</a></li></ul>'); }); Рабочий пример: https://jsfiddle.net/l2banners/v1f8sde6/ Изменено 2 июня, 2018 пользователем L2Banners 1 Поделиться сообщением Ссылка на сообщение Поделиться на другие сайты
TToriginal 396 Опубликовано 2 июня, 2018 3 часа назад, L2Banners сказал: Как вариант: <div id="menu"></div> $(function(){ $("#menu").prepend('<ul><li><a href="#">Пункт 1</a></li><li><a href="#">Пункт 2</a></li><li><a href="#">Пункт 3</a></li></ul>'); }); Рабочий пример: https://jsfiddle.net/l2banners/v1f8sde6/ Спасибо Поделиться сообщением Ссылка на сообщение Поделиться на другие сайты