Не работает данный js на айфоне

$(function () {
    var mixer = mixitup('.directions__list');
    $('.directions__filter-btn').on('click', function () {
        $('.directions__filter-btn').removeClass('directions__filter-btn--active')
        $(this).addClass('directions__filter-btn--active')
    })
})

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

Автор решения: De.Minov

Варианта 1: Использование touchstart

$(function () {
  var isIOS = navigator.userAgent.match(/iPhone|iPad|iPod/i);
  var eventClick = 'click';
  if(isIOS) eventClick = 'touchstart';
  var mixer = mixitup('.directions__list');
  $('.directions__filter-btn').on(eventClick, function () {
    $('.directions__filter-btn').removeClass('directions__filter-btn--active')
    $(this).addClass('directions__filter-btn--active')
  })
})

Говорят, из-за данного решения может не работать скролл. ¯\_(ツ)_/¯

Вариант 2: Добавить к элементу пустой onclick атрибут

Чтобы ваш код заработал, нужно добавить onclick="" к элементу по которому идёт клик.

В вашем случае получается так

<div class="directions__filter-btn" onclick="">...</div>

Вариант 3: cursor: pointer

Не знаю зачем, но IPhone надо, чтобы элемент по которому можно кликнуть имел cursor: pointer.
Я сталкивался с этим когда не работал :hover, но оказывается это ещё и решает проблему с .onclick

.directions__filter-btn {cursor: pointer;}
→ Ссылка