Почему срабатывают все слайдеры на странице?

Question

[DenKuzmin17]

При нажатии кнопок вперёд/назад в любом из слайдеров, срабатывают все. Подозреваю, что виноват ".parents()" и при клике на одну, как бы кликаю все сразу.
Как поправить, чтобы работал только тот, в котором нажата кнопка?

Comments

[Ivan Bogachev]

Дополню ответ 0xD34F парой замечаний:
1. Не используйте символы > и < в разметке. Используйте > и <.
2. Код будет в разы понятнее, если в таких компонентах избегать поиска по родителям. Лучше брать один основной корневой элемент для компонента и манипулировать элементами внутри него, а не снаружи.
3. Вы много раз используете find, чтобы искать одни и те же элементы. Кешируйте это дело, ведь элементы не добавляются и не изменяются в процессе.

[DenKuzmin17]

Ivan Bogachev, спасибо. Перепишу от корневого элемента.

[DenKuzmin17]

Ivan Bogachev, переписал от корня. Теперь всё правильно работает. Спасибо большое ещё раз!

Answer 1

[0xD34F]

Потому что при назначении обработчиков клика кнопкам вроде бы одного конкретного слайдера, на самом деле назначаете их кнопкам всех слайдеров сразу.

Подозреваю, что виноват ".parents()"

И? Никак свои подозрения проверить не попытались? Можно же было посмотреть, что parents возвращает (и чем в результате оказываются prevBtn/nextBtn). Или прочесть об этом в документации.

Меняйте его на .closest('.block') или .parent().next('.slider-btns').

Comments

[DenKuzmin17]

Спасибо большое.