动态使用jQuery UI Slider?

问题描述

我有一个jQuery UI滑块，如果用户在输入元素中键入数字，则滑块会适当移动.

I have a jQuery UI slider in which if the user types numbers into the input element the slider moves appropriately.

$("#slider-range-min").slider({
            range: "min",
            value: 1,
            step: 1000,
            min: 0,
            max: 5000000,
            slide: function (event, ui) {
                $("input").val(ui.value);
            }
        });
        $("input").change(function (event) {
            var value1 = $("input").val();
            $("#slider-range-min").slider("option", "value", value1);
        });

但是我需要的是，无论我第一次在文本框中输入的值是多少，我都希望滑块位于中间，然后如果我将滑块向右移动，则意味着文本框中的值必须增加，而在左边则需要增加必须减少而不设置这些最小值和最大值.

But what i need is i want the slider to be in the middle whatever value i enter in the text box for the first time and then if i move the slider rightside means my value in the textbox has to increase and for leftside it has to decrease without setting these minimum and maximum values..

有什么建议吗?

我需要的是，当我在文本框中输入500时，我的滑块必须自动移动到中心位置.如果我将滑块右侧移动，则末端必须为1000，对于左侧，滑块必须为0，如果我输入400滑块必须自动移动到中心位置，并且右端必须是800，左端必须是

what i need is when i enter 500 in the textbox my slider has to move to the center automatically..if i move the slider rightside the end must be 1000 and for leftside it must be 0 and if i enter 400 slider must move to center position automatically and the rightside end must be 800 and leftside 0

推荐答案

因此，您需要的是将滑块范围从0更改为在文本框中输入的值的两倍?我认为您可以在滑块上使用方法"option"，例如:

So, what you need is to basically change the slider range from 0 to double whatever is entered in the text box? I think you can use the method "option" on the slider such as:

 $("input").change(function (event) {
     var value1 = parseFloat($("input").val());
     var highVal = value1 * 2;
     $("#slider-range-min").slider("option", {"max": highVal, "value": value1});
 });

这是一个小提琴- http://jsfiddle.net/cXYC4/

这篇关于动态使用jQuery UI Slider?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！