Блог

Главная - Вопросы по программированию - Тип диапазона входных элементов не поддерживает событие изменения в FireFox или Safari. Каков обходной путь

Тип диапазона входных элементов не поддерживает событие изменения в FireFox или Safari. Каков обходной путь

#javascript #html

Вопрос:

У меня есть элемент слайдера в моем приложении data viz, в котором я хочу запустить событие с завершением перетаскивания слайдера. Это решение использует change событие и отлично работает в Chrome.

 this.slider.addEventListener('change', e => {
    // do something when slider changes
})

Однако FireFox и Safari поддерживают только это input событие, поэтому описанный выше подход не сработает. Как лучше всего обойти проблему имитации change событий в FireFox и Safari.

Вот весь соответствующий код JS

 const slider = document.createElement('input')
slider.type = 'range'

slider.min = 10
slider.max = 20

document.body.appendChild(slider)

slider.addEventListener('change', e => {
  // do something when slider changes
  console.log("change");
})

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

1. Согласно MDN, change событие поддерживается в Firefox 1.0 и Safar 3.0 и выше.

2. Нет. Слайдер полностью не работает в последней версии FireFox и Safari.

3. Можете ли вы опубликовать HTML-код?

4. Firefox показывает мне событие изменения так же, как Chrome/Edge (Windows10). Не могли бы вы разместить достаточно кода, чтобы мы могли видеть, когда вы ожидаете, что произойдут изменения.

5. Пожалуйста, опубликуйте достаточное количество кода, чтобы мы могли попробовать это сами.Мои тесты показывают, что происходит событие изменения.

Ответ №1:

Ложная тревога. Решенный. Это не имеет ничего общего с элементом ввода/диапазона. У меня есть один или несколько обработчиков событий, прикрепленных к документу, которые используют события мыши, предназначенные для элемента ввода/диапазона.

Метки: