JQuery - как добавить addclass () к элементу, где он соответствует значению атрибута

0

У меня есть группа ссылок для сортировки, например. категорию, имя, дату и другую группу для восходящего/нисходящего. Первоначально, когда страница загружается, ни один из них не будет выбран, и результаты не будут в любом порядке. Когда выбор сделан, мне нужно иметь значения для обеих групп, т.е. сортировка и сортировка.

Например, если пользователь выбирает сортировку по категории, функция ниже использует ASC в качестве направления сортировки по умолчанию. Затем мне также необходимо выделить ссылку с параметром data-value-value = "asc", добавив класс 'selected' в ссылку.

Может ли кто-нибудь помочь?

        $('.sort a').click(function(e) {
            var $this = $(this);

            // Turn 'selected' class on/off
            if ($this.hasClass('selected'))
                return false;
            $this.parents('.sort-set').find('.selected').removeClass('selected');
            $this.addClass('selected');

            if($('.sortKey a.selected').attr('data-option-value')){
                key = $('.sortKey a.selected').attr('data-option-value');
            } else {
                 var key = 'date';
                 //.addClass('selected');  HOW TO DO THIS??
            }

            if($('.sortOrder a.selected').attr('data-option-value')){
                order = $('.sortOrder a.selected').attr('data-option-value');
            } else {
              var order = "asc";  
              //.addClass('selected');  HOW TO DO THIS??
            }

            $container.isotope({sortBy: valBy, sortAscending: valAscending});

            return false;
          });

                    <div class="option-combo sort">
                        <ul class="sort sort-set clearfix sortKey">
                            <li><a href="#" data-option-value="name">Name</a></li>
                            <li><a href="#" data-option-value="category">Category</a></li>
                            <li><a href="#" data-option-value="date">Expiry Date</a></li>
                        </ul>
                    </div>
                    <div class="option-combo sort">
                        <ul class="sort sort-set clearfix sortOrder">
                            <li><a href="#" data-option-value="asc">Ascending</a></li>
                            <li><a href="#" data-option-value="desc">Descending</a></li>
                        </ul>
                    </div>
Теги:
sorting

1 ответ

2
Лучший ответ

Вы можете использовать значение атрибута в селекторе:

$("element[attribute='value']").addClass('selected')

Основываясь на ваших комментариях, похоже, вам может понадобиться сделать что-то вроде этого:

$("a[data-option-value='asc']", ".sortOrder").addClass('selected')
  • 0
    Ваш запрос избыточен ... Вы получаете ссылки с классом selected и добавляете класс selected? Это, похоже, не окажет никакого влияния, так как возвращенные элементы уже будут иметь класс. $ (". sortKey a [data-option-value = 'date']"). addClass ('selected')
  • 0
    То, что я пытаюсь сделать, это проверить, какую ссылку выбрал класс. Затем, основываясь на том, в какой группе находится ссылка, мне нужно добавить класс selected в другую ссылку. Не та же ссылка. Надеюсь, что это имеет смысл.
Показать ещё 3 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню