Есть ли способ заставить обычные ссылки автоматически загружаться через ajax, а не обычным способом?

StackOverflow https://stackoverflow.com/questions/1449074

Вопрос

Я не очень хорошо это объяснил.

Но я имею в виду, что если у меня есть 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

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top