Здравствуйте.
Пытаюсь сделать табы на аяксе. Все работает, но есть пару вопросов.
Вот разметка
Вот сам скрипт
var ajaxLoader = $('[data-loader]'); $('[data-ajax-tab]').on('click', function(e){ e.preventDefault(); var link = $(this); var url = link.attr('href'); $('li.active').removeClass('active'); link.parent().addClass('active'); var contentArea = $('[data-post-content]'); contentArea.empty(); ajaxLoader.show(); setTimeout(function(){ $.get({ url: url, dataType: "html", success: function(template) { contentArea.append(template); ajaxLoader.hide() }, error: function(error) {
} }) }, 2000); });
Сейчас, если перейти по адресу site.name/post/bla-bla/popular, то отдается шаблон, который при нажатии на таб популярные отдается. А как сделать, что бы загрузилась страница, и автоматически таб популярные стал активен?
И второй вопрос, почему query string не изменяется? Я ведь методом гет получаю. Таб активируется, а адрес остается без изменений.
Ответ
Ответ на первую часть вопроса - да просто убрать класс active у предыдущего элемента и сделать его активным у нужного. Вы уже пытаетесь это сделать:
$('li.active').removeClass('active');
link.parent().addClass('active');
Разве не работает?
На вторую часть вопроса смогу дать ответ позже, как конкретизируете его. Впрочем, если я верно вас понял, то функция $.get() и не должна менять адресную строку браузера, так как единственная ее функция - это взять посредством ajax-запроса какой-либо контент. По сути, это обертка для $.ajax(), которая сделана ради понятности кода.
Так что, отвечая на вторую часть вашего запроса, вам нужно менять адресную строку самому. Это делается через объект window, а точнее через window.history. Есть как готовые библиотеки и функции для работы с ним, так и возможность нативно сделать то, что вы хотите. Заметьте, что только при работе с этим объектом пользователь у вас сможет получать ожидаемую работу с историей браузера, когда перемещение по истории будет работать так, как оно и должна работать при динамическом изменении контента.
Комментариев нет:
Отправить комментарий