Захват всех ссылок, включая отправку формы

Question

Мне интересно, как захватить все ссылки на странице с помощью jQuery. Идея похожа на Facebook. В Facebook, если вы нажимаете на ссылку, она захватывает ссылку и загружает ту же ссылку, используя ajax. Только когда вы открываете ссылку в новой вкладке и т. Д., Она загружает страницу с помощью обычного вызова.

Есть какие-нибудь подсказки, как добиться такой функциональности? Уверен, что захват ссылок не должен быть проблемой, но как насчет захвата отправки форм, а затем отправки всех данных через ajax с последующим отображением результатов?

Есть ли плагин, который уже существует?

Спасибо за ваше время.

Answer 1

Alec,

Вы определенно можете сделать это.

У меня есть форма, которая обрабатывается именно таким образом. Он использует плагин jquery form kgiannakakis, упомянутый выше. Пример javascript ниже показывает, как это может работать.

$("form").ajaxForm({
    beforeSubmit: function(){
        //optional: startup a throbber to indicate form is being processed 
        var _valid = true;
        var _msg = '';
        //optional: validation code goes here. Example below checks all input
        //elements with rel attribute set to required to make sure they are not empty
        $(":input [rel='required']").each(function(i){
            if (this.value == '') { 
                _valid = false;
                _msg += this.name + " may not be empty.\n";
                $(this).addClass("error");       
            }
        });
        alert(_msg);
        return _valid; 
    },
    success: function(response){
        //success here means that the HTTP response code indicated success
        //process response: example assumes JSON response
        $("body").prepend('<div id="message" class="' + response.status + '"></div>');
        $("#message").text(response.message).fadeIn("slow", function(){
                $(this).fadeOut("slow").remove();
        });
    }
});

Answer 2

Обычно на страницах, таких как facebook, каждое событие и каждая форма кодируются отдельно, так как файлы на стороне сервера обычно устанавливаются для каждой отдельной операции / группы операций. Я сомневаюсь, что будет простой способ конвертировать страницу просто с помощью плагина. И если это так, я вижу много накладных расходов.

Вы можете сделать это вручную, но опять же, это злоупотребление Ajax. Это не флэш, и с использованием ajax для всех соединений с сервером вы столкнетесь с множеством проблем.

• Отсутствие отслеживания истории.
• Следите за параллельными событиями и их результатами.
• Сообщение пользователю об изменении страницы.
• Пользователи с отключенным JavaScript.
• И многое другое ...

Answer 3

Плагин формы может преобразовать обычную форму в форму Ajax:

$("#myForm").ajaxForm(
   {beforeSubmit: validate, success: showResponse} );

Было бы трудно сделать то, что вы хотите, однако для произвольной формы. Что если форма использует проверку или отправлена ​​Ajax для начала? То же самое относится и к ссылкам. Что делать, если есть несколько сценариев навигации по JavaScript (window.location = Url)? Если у вас нет полного контроля над страницей, вам будет трудно делать то, что вы хотите.