Есть ли способ заставить обычные ссылки автоматически загружаться через ajax, а не обычным способом?
-
11-09-2019 - |
Вопрос
Я не очень хорошо это объяснил.
Но я имею в виду, что если у меня есть ajax-скрипт, который загружает содержимое страницы в элемент DIV, через функцию 'loadpage('whatever.php ');, вместо того, чтобы вручную выполнять это для всех ссылок, есть ли способ создать скрипт, который автоматически загружает все обычные ссылки через эту функцию ajax?
Как и на Facebook, ваш профиль загружается через ajax, но если вы посмотрите на их код, у них просто есть обычная ссылка на профиль.
Ваше здоровье!
Решение
Конечно, вы можете сделать это с помощью jQuery.
Этот скрипт просматривает документ, находит каждый элемент привязки и привязывает обработчик события к событию щелчка каждого из них.При нажатии на элемент привязки обработчик событий находит атрибут href и загружает эту страницу в #targetDiv (разумеется, вы можете называть этот div как угодно).
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js">
</script>
<script type="text/javascript">
$(document).ready(function() {
$("a").click(function() {
$("#targetDiv").load(($(this).attr("href") + " body");
return false;
});
});
</script>
...
<!-- In your document body, this is the div you'd load the pages into. -->
<div id="targetDiv"></div>
Другие советы
Вы можете использовать jQuery для этого (если я правильно понял ваш вопрос).
Сначала вы можете создать функцию loadpage() следующим образом:
function loadpage(divId, url) {
$('#' + divId).load(url);
return false;
}
однако .load() поддерживается не всеми браузерами.Если вы хотите сделать это без .load(), то вы можете проверить .get() .Для получения дополнительной информации о .load() взгляните на http://docs.jquery.com/Ajax/load
Я предполагаю, что это будет выглядеть примерно так:
$(document).ready(function(){
$("a").click(function(){
$("body").load($(this).attr("href") + " body");
return false;
});
});
Это сделало бы все <a>
теги на странице вызывают функцию, которая загружает HTML-документ из href
атрибут тега, удалите его основной тег и замените содержимое основного тега текущей страницы содержимым нового основного тега.Таким образом, с этим проще работать без JavaScript, а также интегрировать его в существующий сайт.
Чтобы использовать его, вы помещаете это в <script>
разместите тег в заголовке вашей главной страницы или во внешнем JS-файле.
Однако, пожалуйста, обратите внимание, что этот код обновляет только содержимое <body>
тег, заголовок (включая тег title) остается нетронутым.Возможно, вам потребуется добавить дополнительный код, чтобы обновить подобные вещи.
Просто и приятно.Зацени это:Бьякс
Использование:
<script src="bjax.min.js" type="text/javascript"></script>
<link href="bjax.min.css" rel="stylesheet" type="text/css" />
Наконец, включите это в ЗАГОЛОВОК вашего html-кода:
$('a').bjax();
Для получения дополнительных настроек ознакомьтесь с демо-версией здесь:Демо-версия Bjax