Страница на основе AJAX нуждается в повторяющихся действиях JavaScript

Question

Я работаю над приложением, которое использует макеты JQuery и загружает только части сайта (например, Gmail). Каждый раз, когда я загружаю «панель» с помощью JQuery, мне приходится заменять некоторые ссылки, чтобы она работала с панелями (то есть загружать содержимое этой ссылки на панели, а не на полной странице). Это что-то вроде этого:

function changeMainPane(href) {
    $("#screen").load(href);
    $("#screen a.ajax-page").click(function () {return
        changeMainPane($(this).attr("href"))
    });
}

Это очень упрощенная функция changeMainPane , у меня есть десятки $ ("# screen ..."). Click () вызывает интеграцию нового фрагмента HTML в страница.

Вопрос в том, есть ли лучший способ сделать это? Что-то вроде:

$("#screen").ready(function() {
    // All my html setups
}

Или что-то вроде «всегда пользователь нажимает на ссылку, проверьте, есть ли класс ajax-page и вызовите эту функцию» без необходимости инициализировать каждую ссылку независимо.

Answer 1

Вы можете взглянуть на делегат метод.Метод делегата может быть зарегистрирован для общего родительского элемента всех ссылок, по которым вы хотите перезагрузить главную панель.Это может быть объект document или элемент более низкого уровня, например "body", или другой элемент типа div, например "div.mylinks".

$(document).delegate("a.ajax-page", "click", function(){
    changeMainPane($(this).attr("href"))
})

.

Answer 2

Может быть, jQuery live() - это то, что вы ищете. Вы используете это так:

$("#screen a.ajax-page").live('click', function () { whatever; });

Тогда вам не нужно повторно инициализировать после активности ajax.