Могу ли я объединить шаблон архива Jquery сортировать по событиям на странице, чтобы они не перезагружали друг друга?

Я использую JQuery, чтобы посетители изменяли порядок запросов и количество страниц на странице архива. Бар в верхней части списка архивов выглядит следующим образом:

сортировать по title/date/poularity см. на странице 'all/20' (и, если применимо, отображать разбивку на страницы).

полная рабочая функция и тег шаблона, который у меня есть до сих пор: pastebin

Все это отлично работает, но в настоящее время два события сбрасывают друг друга - это означает, что я могу изменить сумму, или я могу изменить порядок, но я не могу одновременно работать с сортировкой и сортировкой. Я собираюсь с этим осложниться? Есть ли более простой способ объединить эти два?

$('.amt-button').click(function(){ var a_str = $(this).text();
window.location.href = "?a="+a_str; $(this).addClass("highlight");
});
$('.sorter-dropdown').change(function(){
var o_str = $(this).val();
window.location.href = "?o="+o_str;
$(this).addClass("highlight");
});

Как вы можете видеть выше, они вызываются разными событиями - нажатие кнопки и выбор изменений - но мне было интересно, могу ли я как-то получить значение "a" или "o", если оно уже было установлено и вызвано в другом событии так что они могут применяться одновременно?

Кроме того, подсветка класса сбрасывается после того, как событие перезагружает query- вид рендеринга, и это бесполезно, потому что я хотел визуально выделить кнопку "current" sort & amt/options для пользователя. есть ли способ сделать класс подсветки по-прежнему применяться после того, как новый запрос перезагрузит страницу?

Спасибо за любые идеи!

2 ответа

Я ответил на часть 1 моего первоначального вопроса (как сделать так, чтобы два события не отменяли себя). Это касалось получения и удаления переменной из URL-адреса, которую я тогда использовал с выражением if else, чтобы сказать, undefined использовать значение по умолчанию в адресе, и если оно уже было установлено в URL-адресе, введите это значение.

Вот как выглядит "сортировка" (пока он работает!): Как выглядит сортировка

Полная функция (все еще немного беспорядочная). Вставить полный код bin.

У меня все еще возникают проблемы с применением класса подсветки для текущих кнопок/опций. Моя логика до сих пор заключается в том, чтобы сделать функцию, которая запускается с загрузкой окна и извлекает переменную из url - тогда проверяет, есть ли кнопка с равным значением - и если это применит класс к указанной кнопке. Однако я думаю, что мне не хватает некоторых ключевых предметов, чтобы добраться туда:

'// trying to make highlight style carry over.
$(window).load(function(){ // get the amt per value from url set it as amt_highlight var var amt_highlight = $.getUrlVar('amt_per'); // if a button with class.amount-buttons value is equal to amt_highlight if ( $('.amt-button').val(); == amt_highlight){ // then add class to that button $(this).addClass("highlight"); }
});'

Кто-нибудь знает, что мне не хватает?


Я снова ответил на свой вопрос (part2 о том, что кнопки и опции имеют текущий класс). Я считаю, что они оба были связаны друг с другом, чтобы быть в одном вопросе, потому что они оба были о том, как получить значения var в URL-адресе, чтобы использовать их в такая же общая функция - но это был мой первый пост на этом сайте - так, может быть, я неправильно понял. Что я окончательно разработал:

$(".amt-button").addClass(function(index) {
var addedClass;
var amt_current = $.getUrlVar('amt_per');
var amt_val = $(this).val();
if ( amt_val == amt_current ) { addedClass = "current";
}
return addedClass;
});

Чтобы объяснить: функция addclass вызывает кнопки с классом кнопок amt - и если их значение равно значению var, удалённому от url - класс current добавляется к текущей кнопке. Хорошо, что вы контролируете, как кнопки отображают для пользователя. надеюсь, это помогает кому-то, если они борются с этим, как и я.

licensed under cc by-sa 3.0 with attribution.