jQuery 滑块“slide”事件:如何确定用户的幻灯片方向

jQuery slider "slide" event: How do I determine the user's slide direction?

本文关键字：用户 何确定 幻灯片 方向 滑块 slide 事件 jQuery      更新时间：2023-09-26

我一直在剖析Firebug中的事件和UI对象，但它似乎没有我可以使用的东西。我错过了什么吗？我想我可以跟踪值的变化，但这似乎是一个难题。

$(".selector").slider({
    slide: function(event, ui){
        // I need to tell if the slide is left-to-right or right-to-left here.
    }
});

谢谢！杰森

对于想知道如何解决这个问题的每个人，我刚刚找到了一个解决方案：

从包含幻灯片的两个全局变量开始。我的滑块总是从 0 开始，从左到右，所以第一个 nexSlide wikll 是 1。现在，您可以简单地比较两者，看看您滑动的方向。此方法是最有效的，因为它可以在不停止滑块的情况下检测方向变化。

   var currentSlide = 0; var nextSlide = 1;
   jQuery( "#slider" ).bind( "slide", function(event, ui) {
       currentSlide = jQuery('#slider').slider('value');
       nextSlide = ui.value;
    });

如果要获取方向（值减小或增加），只需使用开始和滑动事件即可。触发启动事件时，将初始值存储在变量中。之后，只需将此存储值与滑动事件创建的值进行比较即可。

只需结合不同的事件。

编辑前：

使用记录的吸气剂

var orientation = $( ".selector" ).slider( "option", "orientation" );

此选项确定是否 滑块的最小值位于左侧，即 右侧的最大值或右侧的最小值 底部，顶部的最大值。可能 值："水平"、"垂直"。

简单的解决方案是简单地使用负范围（而不是 [1 - 10] 使用 [-10 ， -1]：

        $("#slider-roomsrange").slider({
        range: true,
        min: -10,
        max: -1,
        step: -.5,
        values: [-3, -1],
        slide: function (event, ui) {
            $("#roomsfrom").val((ui.values[0]*-1));
            $("#roomsto").val((ui.values[1]*-1));
           // $("#rooms").val(ui.values[1] + " - " + ui.values[0]);
        }
    });

我正在使用 *-1 将值反转为正值并工作 gret。

*我目前唯一的问题是步长是 1 而不是我预期的 .5。

相关文章：