关键词：
【中文标题】根据第一个滑块状态动态设置 jQuery UI 中滑块的最大值【英文标题】：Set max value of slider in jQuery UI dynamically based on first slider state 【发布时间】：2018-06-29 06:35:10 【问题描述】：如何根据第一个滑块 #slider1 的状态设置第二个滑块 #slider2 max 的值？
$("#slider1").slider(
value: 100,
min: 0,
max: 500,
step: 50,
slide: function(event, ui)
$("#slider-value").html(ui.value);
);
$("#slider-value").html($('#slider').slider('value'));
$("#slider2").slider(
value: 100,
min: 0,
step: 50,
slide: function(event, ui)
);
【问题讨论】：
您希望滑块何时更新？我假设在第一个滑块的slide 期间。
【参考方案1】：
这是一个基本示例。在此处查看更多信息：http://api.jqueryui.com/slider/#option-max
$(function()
$("#slider1").slider(
value: 100,
min: 0,
max: 500,
step: 50,
slide: function(event, ui)
$("#slider1-value").val(ui.value);
$("#slider2").slider("option", "max", ui.value * 1.5);
var max = $("#slider2").slider("option", "max");
$("#slider2-max").val(max);
);
$("#slider2").slider(
value: 100,
min: 0,
max: 500,
step: 50,
slide: function(event, ui)
$("#slider2-value").val(ui.value);
);
$("#slider1-value").val($('#slider1').slider('value'));
$("#slider2-value").val($('#slider2').slider('value'));
);p input
width: 3em;
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<p>
<label for="amount">Slider #1 Value:</label>
<input type="text" id="slider1-value" readonly style="border:0; color:#f6931f; font-weight:bold;">
</p>
<div id="slider1"></div>
<p>
<label for="amount">Slider #2 Value:</label>
<input type="text" id="slider2-value" readonly style="border:0; color:#f6931f; font-weight:bold;">
<label for="amount">Slider #2 Max:</label>
<input type="text" id="slider2-max" readonly style="border:0; color:#f6931f; font-weight:bold;">
</p>
<div id="slider2"></div>.slider("option", "max") 将获取值，.slider("option", "max", 500) 将设置值。
【讨论】：
如何防止多个句柄在 jQuery UI 滑块中重叠？
...lider?【发布时间】：2017-03-2312:13:42【问题描述】：我想要一个带有两个句柄的jQueryUI滑块，可以将它们的值设置为彼此独立。我还希望它们被设计成一个手柄在滑块的“顶部”，而另一个手柄在下面。问题是当两个句柄共享相同... 查看详情
如何动态更改 jquery ui 滑块的最小值、最大值？
...er?【发布时间】：2012-02-0609:38:26【问题描述】：所以我有一个带有jqueryui滑块的页面，它使用以下内容进行了初始化：varmin=$("#attrInformation").data("lowest_price"),max=$("#attrInf 查看详情
设置最小值或最大值后如何刷新 jQuery UI 滑块？
...axvalues?【发布时间】：2011-09-1401:24:43【问题描述】：我有一个ui.slider并在运行时更改它的最小值和最大值。但是这些更改只会反映在视图中，当我在之后设置值时（这会导致它触发不需要的事件）。在我看来，它也应该在设置最... 查看详情
如何在我的视图中包含一个 Jquery UI 滑块？
】如何在我的视图中包含一个JqueryUI滑块？【英文标题】：HowdoIincludeaJqueryUIsliderinmyview?【发布时间】：2018-07-0116:09:54【问题描述】：我正在尝试将滑块(http://simeydotme.github.io/jQuery-ui-Slider-Pips/#installation)合并到我的视图中，这应该... 查看详情
如何使用 jQuery UI 滑块动态更新 highcharts
】如何使用jQueryUI滑块动态更新highcharts【英文标题】：HowtodynamicallyupdatehighchartsusingjQueryUIsliders【发布时间】：2013-03-1211:44:47【问题描述】：我正在寻找一种基于jQueryUI滑块确定的值动态更新Highcharts的方法。我还不太熟悉AJAX或JSON... 查看详情
在使用动态数据的滑块中实现 jQuery
...动态数据的滑块添加到我的django项目中，我收到了制作上一个和下一个按钮的帮助，该按钮可以在配置文件中滑动，但我现在专注于上一个，在这个过程中我意识到代码中有一个NoReverseMatch错 查看详情
使用 URL 查询字符串加载页面时 jQuery 设置 UI 滑块
...描述】：我在各种SO问题下搜索了许多有希望的答案，每一个都尝试了-无济于事。我缩小了网页，只关注我无法弄清楚的两个问题：当页面第一次加载时，我想解析一个URL查询参数（如果存在），并使用结果来设置用户将看到的... 查看详情
jQuery UI 滑块自定义不起作用 [关闭]
...所以我在http://jsfiddle.net/Cupidvogel/gdfgv/试用了这段代码。根据文档，我在滑块中包含了一个类ui-slider-h 查看详情
jQuery UI：滑块位置更改时的操作
...片的div元素（“id_1”）。所以我现在真正想要的是图片根据滑块的位置而变化。 查看详情
创建滑块以动态显示图像中两条线的距离
...：2016-10-1117:37:42【问题描述】：我是新的jQuery。我想创建一个滑块，它将沿图像的x轴移动绿线，如您在图像中看到的那样。从图像中您可以看到有两行（第1行，第2行）。我有JSON对象中行的值(x,y)。当我移动滑块时，我想通过遍... 查看详情
JQuery UI 范围滑块值
...也是如此。问题是文本值最初不在正确的位置，当我移动一个手柄时，另一个手柄的值消失了。这里是 查看详情
动态设置 Kendo UI Slider 的最大值
...2013-04-1109:27:59【问题描述】：我正在使用KendoUI并创建了一个滑块。当我通过Razor创建滑块时，滑块的限制为min16max80。@(Html.Kendo().Slider().Name("Age").Value(16).Min(18).Max(80) 查看详情
如何限制 jQuery UI 滑块的范围？
...er?【发布时间】：2017-04-1903:17:32【问题描述】：我创建了一个jQueryUI滑块，它的range设置为true，并且在0和4处有两个句柄。我想将这些句柄的范围限制在最大4。这意味着当用户滑动其中一个手柄并且其他手柄的位置使范围超出4时... 查看详情
JQuery UI滑块'slide'功能未设置angularJS值
】JQueryUI滑块\\\'slide\\\'功能未设置angularJS值【英文标题】：JQueryUIslider\'slide\'functionnotsettingangularJSvalueJQueryUI滑块\'slide\'功能未设置angularJS值【发布时间】：2017-01-0311:43:16【问题描述】：我试图通过捕获来自Slide函数的值并将其设... 查看详情
jQuery-ui 滑块不适用于 jQuery-ui Touch Punch
...uery-ui滑块，我正在尝试使用jQuery-uiTouchPunch在iPad上工作。根据文档，一旦我包含了该库，我只需执行以下操作即可使其在iPad上运行。$(".ui-slid 查看详情
尝试构建一个 jQuery 滑块
】尝试构建一个jQuery滑块【英文标题】：TryingtobuildajQueryslider【发布时间】：2019-07-2300:50:31【问题描述】：我试图在WordPress中构建一个动态滑块，使用jquery加载动态画廊图像的php数组，我事先不知道滑块中有多少图像。这是我目... 查看详情
我希望我的jqueryui范围滑块根据输入值动态移动(代码片段)
hereistherangeslider基本上我想在我更改输入内部的数字时移动滑块。HTML代码：<inputid="txtMinPrice"type="text"placeholder="dela"><inputid="txtMaxPrice"type="text"placeholder="panala"><divid="price__range"></div>jQuery代码：`varsliderElement=$('#price_... 查看详情
Jquery UI Slider 增量和减量
...钮时移动滑块。请帮忙..【问题讨论】：【参考方案1】：根据documentation你可以像这样设置值$(".selector").slider 查看详情