Question

我正在使用jQuery UI创建6个具有相同选项（调查）的滑块。

我想知道是否有办法将所有这些滑块组合成一个功能，但是它们可以单独使用吗？

如果是这样，会是这样的：

$('#slider').each(function () {
    var $this = $(this).closest('#slider');

    $($this).slider(
    {
        value: 100,
        min: 0,
        max: 100,
        step: 25,
        slide: function (event, ui) {
            $('#amount').val('$' + ui.value);
        }
    });
    $('#amount').val($('#slider').slider("value"));

我环顾四周，看看能否找到一些相关的问题，但我仍然无法解决。现在，只有6个滑块中的第一个可见。

Answer 1

不确定是什么问题。此 jsFiddle example 表明它只是一个基本设置。移动任何滑块都会在输入字段中显示滑块的值。

的jQuery

$('.slider').slider({
    slide: function(event, ui) {
        $('input:eq('+ $(this).index() +')').val(ui.value);
    }
});

HTML

<div class="slider"></div>
<div class="slider"></div>
<div class="slider"></div>
<div class="slider"></div>
<div class="slider"></div>
<div class="slider"></div>
<input /><br />
<input /><br />
<input /><br />
<input /><br />
<input /><br />
<input />

修改：更新代码以反映评论。

多个滑块在一个功能中具有相同的选项？

1 个答案: