1

所以我有一个选择和一个函数，可以使用http://filamentgroup.com/lab/update_jquery_ui_slider_from_a_select_element_now_with_aria_support/将其转换为滑块

<select id="{{ section }}-anonymity-select">
    <option value="anonymous"></option>
    <option value="uw-student"></option>
    <option value="username"></option>
</select>

function setup_form(section){
    $("#"+section+"-anonymity-select").selectToUISlider({tooltip: false, labels: 0, sliderOptions: {
        slide: function(event, ui){
            alert(ui.value);
        }
    }
    }).hide();

我想做的是（现在，稍后我想根据值更改另一个元素的 innerHtml）在用户滑动时提醒滑块的当前值。

代码几乎完成了我想要的，除了滑动事件“在滑动期间每次鼠标移动都会触发。”，这意味着一张小幻灯片大约 10 次。很烦人。不是我想要的。而且它似乎也以编程方式改变了值——我的手柄一直在到处乱跳。

我也尝试过更改，但它只在停止时触发，所以如果用户只是来回滑动而不释放鼠标按钮，它不会发出警报。坏的。

我该如何处理？我想我需要像“关于价值变化”这样的事件？但是如何在不不断检查的情况下实现它呢？

4

2 回答 2

0

而不是使用slide事件，您应该使用change仅在用户停止与小部件交互时触发的事件：

改变：

    slide: function(event, ui){
        alert(ui.value);
    }

到：

    stop: function(event, ui){
        alert(ui.value);
    }

哇啦！:)

当用户停止滑动时触发该事件。

来源：http: //jqueryui.com/demos/slider/#event-stop

更新

您可以使用该slide事件并设置一个超时来提醒该值，因此当用户继续滑动时不会出现任何提醒（由于取消超时）：

var slidervalue = 0,
    timer;

function setup_form(section){
    $("#"+section+"-anonymity-select").selectToUISlider({tooltip: false, labels: 0, sliderOptions: {
        slide: function(event, ui){
            clearTimeout(timer);
            setTimeout(function () {
                if(ui.value!=slidervalue){
                    $("#"+section+"-anonymity-header").html("Select anonymity level: "+$(this).slider('values', ui.value));
                    slidervalue = ui.value;
                }
             }, 100);
        }
    }
    }).hide();
于 2012-03-15T20:09:19.577 回答
0

当然，在我发布 2 分钟后，我意识到了一个解决方案。

var slidervalue = 0;

function setup_form(section){
    $("#"+section+"-anonymity-select").selectToUISlider({tooltip: false, labels: 0, sliderOptions: {
        slide: function(event, ui){
            if(ui.value!=slidervalue){
                $("#"+section+"-anonymity-header").html("Select anonymity level: "+ui.value);
                slidervalue = ui.value;
            }
        }
    }
    }).hide();
于 2012-03-15T20:15:30.763 回答