jQuerymobile滑块触点滞后

Question

我用滑块来改变我用flot显示的图表的最小/最大值。

这是我的滑块HTML：

<div id=timerangeslider>
        <form>
            <div class="ui-grid-a" id="slider3">
            <label for="slider-2">Anzeige-Zeitraum (in Stunden):</label>
            <input type="range" name="slider-2" id="slider-2" data-highlight="true" min="1" max="48" value="24">
            </div><!-- /ui-grid -->
        </form></div>

这是我的jQuery：

function timerangeslider() {
    $(document).ready(function(){
        $("#slider-2").change("click",function() {
            timerange = $("#slider-2").val();
            energyPlot(d,timerange)
        });
    });
}

函数在"pageinit“上被调用。它调用另一个函数"energyPlot“来更新我的图表(使用flot)

这个解决方案的问题是，在“#滑块-2”值的每一个变化上重新绘制我的图表，所以这是可行的，但是看起来很糟糕。

另一个解决办法是：

function timerangeslider() {
    $(document).ready(function(){
        $(document).on("click","#timerangeslider",function(event) {
            timerange = $("#slider-2").val();
            energyPlot(d,timerange)
        });
    });
}

这里的问题是，在我的设备(使用Phonegap)上，它不能识别实际滑块上的触点。您可以单击滑块左边的数字，它将得到触摸，但如果拖动滑块，则不能。不过，它可以在浏览器中工作。

对于实际滑块上的触碰(在phonegap设备上)有什么想法，或者只有当滑块停止时才能重新绘制图表的第一个解决方案？

Answer 1

刚刚在这里找到了解决方案jQueryMobile slider change event

似乎有一个事件的滑块称为“滑动停止”，你可以听它。

所以我用了这个：

function timerangeslider() {
        $("#slider-2").on("slidestop",function(event) {
            timerange = $("#slider-2").val();
            energyPlot(d,timerange);
        });
}