Question

我使用的是jQuery插件Simple Slider（fiddle here），但在触摸设备上，无法拖动范围值句柄。

我尝试通过替换＆＃34; mousedown，mousemove和mouseup＆＃34;来编辑下面的simple-slider.js中的代码部分。使用＆＃34; touchstart / move / end＆＃34;的相应触摸值; - 但这没有用。

如何在触控设备上使用？

this.track.bind("mousedown touchstart", function (e) {
    return i.trackEvent(e)
}), this.settings.highlight && this.highlightTrack.bind("mousedown touchstart", function (e) {
    return i.trackEvent(e)
}), this.dragger.bind("mousedown touchstart", function (e) {
    if (e.which !== 1) return;
    return i.dragging = !0, i.dragger.addClass("dragging"), i.domDrag(e.pageX, e.pageY), !1
}), e("body").bind("mousemove touchmove", function (t) {
    if (i.dragging) return i.domDrag(t.pageX, t.pageY), e("body").css({
        cursor: "pointer"
    })
}).bind("mouseup touchend", function (t) {
    if (i.dragging) return i.dragging = !1, i.dragger.removeClass("dragging"), e("body").css({
        cursor: "auto"
    })
}), this.pagePos = 0, this.input.val() === "" ? (this.value = this.getRange().min, this.input.val(this.value)) : this.value = this.nearestValidValue(this.input.val()), this.setSliderPositionFromValue(this.value), r = this.valueToRatio(this.value), this.input.trigger("slider:ready", {
    value: this.value,
    ratio: r,
    position: r * this.slider.outerWidth(),
    el: this.slider
}

以下是插件信息的链接：http://loopj.com/jquery-simple-slider/

Answer 1

Simple Slider的以下更新代码支持鼠标和触摸事件：

https://raw.githubusercontent.com/jeffedsell/jquery-simple-slider/master/simple-slider.js

jQuery Simple Slider不响应触摸事件

1 个答案: