jquery - 具有相同选项的多个 slider 都在一个功能中？

Question

我正在使用 jQuery UI 创建 6 个具有相同选项的 slider (调查)。

我想知道是否有一种方法可以将所有这些 slider 组合成一个功能，但又可以单独操作它们？

如果是这样，会不会是这样的:

$('#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 个 slider 中的第一个可见。

Answer 1

不确定是什么问题。这个 jsFiddle example 显示这只是一个基本设置。移动任何 slider 会在输入字段中显示该 slider 的值。

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 />​

编辑:更新代码以反射(reflect)评论。