jQuery UI滑动器更改和滑动事件报告不同的结果

Question

好的，这里也有一个非常相似的问题

jQuery UI Slider - 'Event on release不同于'change'值

但我认为答案是不令人满意的。下面是我的JavaScript代码:http://jsfiddle.net/AsDZJ/4/

function slideVal() {
    var number = $("#number_slider").slider("value");
    $("#number_field").append('Slide: ' + number + '<br/>');
}
function changeVal() {
    var number = $("#number_slider").slider("value");
    $("#number_field").append('Change: ' + number + '<br/>');
}
$(function() {
    $( "#number_slider" ).slider({
        min: 1,
        max: 10,
        change: changeVal,
        slide: slideVal
    });
    $( "#number_slider" ).slider( "value", 5 );
});

问题是当change处理程序被调用和slide处理程序被调用时，滑动条报告的值不同。

现在，另一个问题指出，如果你匿名声明函数，你可以简单地使用ui。值，如下所示:

$( "#number_slider" ).slider({
    min: 1,
    max: 10,
    change: function(event, ui) {
        $("#number_field").append('Change: ' + ui.value + '<br/>');
    }
});

这确实提供了更一致的结果，但也意味着，如果，就像我的情况一样，每当事件发生变化时，我都要执行许多复杂的逻辑，我必须重复代码。此外，计算还涉及到来自多个滑块的滑块值。

如何从显式声明的函数中获得正确的值?这种行为在jQuery UI是一个bug吗?

谢谢

Answer 1

你仍然可以定义带有参数的全局函数，当你初始化滑块时，只需传递函数名而不是使用匿名回调

function slideVal(e, ui) {
    var number = ui.value;
    $("#number_field").append('Slide: ' + number + '<br/>');
}
function changeVal(e, ui) {
    var number = ui.value;
    $("#number_field").append('Change: ' + number + '<br/>');
}
$(function() {
    $( "#number_slider" ).slider({
        min: 1,
        max: 10,
        change: changeVal,
        slide: slideVal
    });
    $( "#number_slider" ).slider( "value", 5 );
});