Выцепить value у элемента с динамическим классом (JS)

Question

Пытаюсь получить значение value у объекта, класс которого меняется динамически, с помощью другого js скрипта. Менять ничего в этом скрипте я не могу.

При клике на любой элемент списка, класс active переходит к нему. но с помощью find('.active').val() я получаю лишь ошибку.

Uncaught TypeError: Cannot read properties of undefined (reading '0')

var zabor_type = $('.type_zabor').find('.active').val() //

<ul class="type_zabor">
    <li class="active list-item" value='0'>Вариант 1</li>
    <li class="list-item" value='1'>Вариант 2</li>
    <li class="list-item" value='2'>Вариант 3</li>
</ul>

Каким еще способом можно получить value?

Answer 1

У вас ошибка:

Вы задаёте атрибут value тегу <li> что является некорректным, тк атрибут value может быть только у элементов формы, к примеру, у <input>

Если можно изменить разметку, то лучше поменяйте таким образом, value замените на data-value, ваш код станет таким:

<ul class="type_zabor">
    <li class="active list-item" data-value='0'>Вариант 1</li>
    <li class="list-item" data-value='1'>Вариант 2</li>
    <li class="list-item" data-value='2'>Вариант 3</li>
</ul>

Что-бы получить активный, потребуется:

var zabor_type = $('.type_zabor > .list-item.active').data().value;

Если разметку менять нельзя, в силу каких то обстоятельств, то решение будет:

var zabor_type = $('.type_zabor > .list-item.active').attr('value');

БЛОГ НА HUSL

Выцепить value у элемента с динамическим классом (JS)

Ответы (1 шт):