jQuery | Загрузка div с другой страницы по клику
Как с помощью jQuery получить данные с другой страницы вашего сайта и подгрузить их туда куда вам нужно без обновления страницы.
Чтобы подгрузить нужный участок данных, контейнер или картинку с другой страницы вашего сайта достаточно воспользоваться функцией load, которая загрузит то что вам нужно в место которое вам нужно.
Итак, чтобы загрузить необходимый блок с id "что" из страницы page.html на нашу страницу в блок с id "куда" необходимый такой код:
JavaScript / jQuery
<script type="text/javascript" language="JavaScript">
$('#куда').load('page.html #что > *');
</script>
HTML
<div id="куда">Загрузка...</div>
В случае, если вы хотите чтобы подгрузка информации выполнялась по клику определенной кнопки, а не сразу при загрузке страницы, то выглядеть это будет так:
JavaScript / jQuery
<script type="text/javascript" language="JavaScript">
$(document).ready(function(){
$('#knopka').click(function(){
$('#kuda').load('page.html #chto > *');
})
});
</script>
HTML
<div id="knopka">Я кнопка. Кликни меня!</div>
<div id="kuda">Загрузка...</div>
Помимо этого, также из div с уникальным id (можно также из класса, только он тоже должен быть уникальным) можно выбирать лишь то, что нам нужно, например, содержание строк - p или картинки img, да, в целом, что угодно, выглядеть это будет так:
JavaScript / jQuery
<script type="text/javascript" language="JavaScript">
$(document).ready(function(){
$('#knopka').click(function(){
$('#kuda').load('page.html #chto img');
})
});
</script>
Добавлять комментарии могут только зарегистрированные пользователи.
[
Регистрация |
Вход ]
"Странный этот мир, где двое смотрят на одно и то же, а видят полностью противоположное."
© Агата Кристи
Записки вебмастера
Рубрика, которая призвана собрать коллекцию полезных скриптов и авторских решений, интересных особенностей и стандартов верстки, решение вопросов юзабилити и функционала, полезных ресурсов и программ.
4.0 (8)
16147
0
