Question

我正在使用jquery滑块，如果我滑动滑块，则在滑动功能中我将测试某些场景。如果不满足方案，则应将滑块放回原位。

例如：

当前滑块值为1，用户将其滑动到值2，在slide：function（event，ui）函数中检查条件是否不满足滑块的值应该恢复为值1。

因此我使用了else部分中的代码

$（＆＃34;＃slider＆＃34;）。slider（{value：parseFloat（return_slider_value）}）;
$（＆＃34;＃slider＆＃34;）。slider（＆＃39; value＆＃39;，1）;

它没有设置值1仍然在滑块中显示值2.

我的要求是滑块值的值应该动态改变。

var slider_Value = $.trim(data.details.merchant_table_booking_hours);
if (slider_Value == '') 
{
  slider_Value = 0;
}
var return_slider_value = slider_Value;
$("#slider").slider({
value: slider_Value,
min: 0,
max: 12,
step: 0.5,
slide: function (event, ui) 
{
    var selected_button_count = 0;
    $(".time_slot_buttons").each(function () 
    {
        if(this.attr('selected-id')==0)
        {
            selected_button_count = parseInt(selected_button_count)+1;
        }
    });
    if (selected_button_count>0)
    {
        if (parseFloat(ui.value) != 0) 
        {
            $("#slider-value").val(ui.value);
            $("#show-slider-hrs").html(ui.value + " hrs ");
        } else 
        {
            $("#slider-value").val('');
            $("#show-slider-hrs").html('');
        }
    }
    else
    {
        alert("Please Select a Floor And Timing Buttons" + return_slider_value);
        $("#slider-value").val(return_slider_value);
        $("#show-slider-hrs").html(return_slider_value + " hrs ");
        $("#slider").slider({ value: parseFloat(return_slider_value) });                                                                 
        $("#slider").slider('value', 1);
    }
}
})

提前致谢。

Answer 1

正如您将在jQuery UI Slider（http://api.jqueryui.com/slider/）上的API文档中看到的那样，在初始化之后，可以通过以下方式读取和设置滑块：

// Getter
var value = $( ".selector" ).slider( "option", "value" );

// Setter
$( ".selector" ).slider( "option", "value", 10 );

修改

答案可能取决于您返回slide事件的值。考虑一下这段代码。

$(function() { $("#slider").slider({ value: 1, min: 0, max: 12, step: 0.5, slide: function(event, ui) { //Evaluate condition var condition = false; //or true if (!condition) return false; //Canceling the event will prevent the handle from moving and the handle will continue to have its previous value. else return true; } }); });

完整example here。

取消slide事件将阻止句柄移动，句柄将继续保持其先前的值。

Jquery UI Slider在滑动滑块时动态设置值

1 个答案: