Автоматические селекторы ajax с помощью Jquery

Question

Я пытаюсь создать тестовый веб-сайт, но мне нужна идеальная деградация.Поэтому я собираюсь сначала закодировать веб-сайт на простом XHTML, а затем добавить классы и идентификаторы, чтобы подключить их к jQuery.

Одна вещь, которую я хочу сделать, — это в конечном итоге включить Ajax xmlhttprequest для всех моих ссылок, чтобы они отображались в div области просмотра.Я хочу, чтобы эта область просмотра была «универсальным» дампом для любого запроса xmlhttp с нескольких внешних страниц.

Мне было интересно, смогу ли я жестко закодировать что-то вроде:

<a href="blah.html" class="ajax">, <a href="bleat.html" class="ajax">

и т. д.Итак, как вы можете видеть, я даю все теги ссылок, из которых я хочу вызывать Ajax-запросы, с помощью класса ajax.В моем JS, основанном на jQuery, я хочу иметь возможность закодировать его так, чтобы все положительные ${"a").filter(".ajax") автоматически загружали соответствующие hrefs [переменную] в качестве запроса ajax.

Пожалуйста помоги.Я n00b.

Answer 1

На вашем примере вы сможете:

$('.ajax').click(function () { 
    // Your code here. You should be able to get the href variable and
    // do your ajax request based on it. Something like:
    var url = $(this).attr('href');
    $.ajax({
        type: "GET",
        url: url
    });
    return false; // You need to return false so the link
                  // doesn't actually fire.
});

Я бы предложил использовать класс, отличный от «ajax», потому что это делает код немного странным для чтения, потому что $('.ajax') может быть неправильно истолковано как $.ajax().

А $('.ajax').click() часть регистрирует обработчик событий onClick для каждого элемента на странице с классом «ajax», а это именно то, что вам нужно.Затем вы используете $(this).attr('href') чтобы получить ссылку на конкретную ссылку, а затем делать все, что вам нужно!

Answer 2

Что-то вроде:

function callback(responseText){
    //load the returned html into a dom object and get the contents of #content
    var html = $('#content',responseText)[0].innerHTML;
    //assign it to the #content div
    $('#content').html(html);
}

$('a.ajax').click(function(){
    $.get(this.href, callback);
    return false;
});

Вам нужно проанализировать все, что находится за пределами тега #content, чтобы навигация не отображалась более одного раза.Я думал о регулярном выражении, но, вероятно, для этого проще использовать jQuery, поэтому я обновил пример.