Блог

Главная - Вопросы по программированию - Как поддерживать указатель на элемент списка [jquery]

Как поддерживать указатель на элемент списка [jquery]

#javascript #jquery

#javascript #jquery

Вопрос:

Я пытаюсь включить управление с клавиатуры (стрелка вверх / вниз)

У меня есть мои коды jquery в виде

 if($('.yumnak').hasClass('itemCur')) {
    var pntr = $('.yumnak').hasClass('itemCur');
    pntr.next().addClass('itemCur');
    pntr.next().removeClass('item');
    pntr.removeClass('itemCur');
    pntr.addClass('item');
}

и разметка в виде

 <ul>
  <li class="yumnak itemCur"><a href="#">one</a></li>
  <li class="yumnak item"><a href="#">two</a></li>
  <li class="yumnak item"><a href="#">three</a></li>
  <li class="yumnak item"><a href="#">four</a></li>
</ul>

Здесь, разве мой pntr не будет работать?? Кажется, это не работает. Как мне поддерживать указатель??

Ответ №1:

Запись $('.yumnak').hasClass('itemCur') возвращает логическое значение, указывающее, есть ли у него класс.

Вы, вероятно, хотите написать $('.yumnak.itemCur') , чтобы выбрать элемент с обоими классами..

Ответ №2:

hasClass просто возвращает логическое значение. Вы хотите выбрать элемент, который вы можете сделать следующим образом:

  var pntr = $('.yumnak.itemCur');

Ответ №3:

Что они все сказали. В настоящее время var pntr возвращается либо true, либо false, поэтому ваша цепочка jquery фактически не привязана ни к одному узлу документа. Он пытается связать либо с true , либо false что приведет к сбою.

вы могли бы установить var pntr = $(this) , что должно ссылаться на родительский элемент в условии.

итак 

 if($('.yumnak').hasClass('itemCur')) {
    var pntr = $(this);
    pntr.next().addClass('itemCur');
    pntr.next().removeClass('item');
    pntr.removeClass('itemCur');
    pntr.addClass('item');
}

Комментарии:

1. обратите внимание, использование $ (this) экономит при синтаксическом анализе DOM, что приводит к более быстрому выполнению jquery, поскольку ему не нужно начинать с начала в каждой цепочке.

Ответ №4:

var pntr = $('.yumnak').hasClass('itemCur'); вернет true или false в зависимости от того, содержит ли элемент этот класс. Чтобы получить фактический дескриптор элемента, используйте:

var pntr = $('.yumnak'); вместо этого.

Ответ №5:

hasClass Функция возвращает логическое значение.

На самом деле вы вызываете метод next() для логического значения.

Попробуйте это:

 var pntr;

if ($('.yumnak').hasClass('itemCur')) {
    pntr = $('.yumnak');
} else {
    return; //or do other stuff
}