javascript - Swiper.js with Rangeslider.js - 在 Rangeslider.js onSlide 回调函数上禁用 Swiper.js 触摸事件

Question

我在 iDangerous 的swiper.js之上使用 Andre Ruffert 的rangeslider.js ，但每次我滑动我初始化的 rangeslider 时，它也会刺激 Swiper 的触摸滑动事件，因此它们都同时滑动。在滑动 Rangeslider 时，我可以使用什么方法来禁用 Swiper？我是 jQuery 的新手，所以任何帮助都将不胜感激。

这是我的代码：

HTML

<div class="swiper-container">
  <div class="swiper-wrapper">
    <!--First Slide-->
    <div class="swiper-slide"> 
    <input type="range" class="rangeslider"/>
  </div>

  <!--Second Slide-->
  <div class="swiper-slide">
    <h2>Slide 2</h2>
  </div>

  <!--Etc..-->

JS

var mySwiper = $('.swiper-container').swiper({

mode:'horizontal',
loop: true

});

$('input[type="range"]').rangeslider({

polyfill: false,

// Callback function
onSlide: function(position, value) {},

// Callback function
onSlideEnd: function(position, value) {}
});

Answer 1

将 swiper-no-swiping 类添加到范围滑块：

$('input[type="range"]').addClass('swiper-no-swiping');