javascript - 一次更改后调整所有 jQuery UI 微调器的最大值？

Question

从 jQuery UI 1.9 里程碑 7 开始，我正在使用 jQuery UI 微调器的 beta 版本。我想要做的是以下内容：我有一系列微调器输入，它们都具有相同的类，我可以用作一个 jQuery 选择器 (.spinner)。这些微调器正在为一组对象设置值，这些对象都来自同一个资源“池”。每次更新微调器的值时，我都想根据该资源池剩余的数量来更新所有微调器的最大值。这是到目前为止的基本代码：

var unusedPool = 500;

jQuery(document).ready(function($) {
    $('.spinner').spinner({
        min: 0,
        max: (unusedPool + this.value),
        change: function(event, ui) {
            // An AJAX call which pushes the change to the DB,
            // and returns a JSON object containing the change in what remains
            // in the resource pool.
            jQuery.ajax({
               // URL, type, etc. etc.
               data: { newValue: this.value },
               success: function (data) {
                   unusedPool -= data.change;
                   // Here is where I need to go through and update *all* spinners,
                   // so their new "max" is their current value plus the new 
                   // unusedPoolSize.
               }
            }   
        }
});

有没有办法做我想做的事？我是否需要将事件绑定到所有微调器然后触发该事件，或者是否有更直接的方法（在更改回调中）来访问所有微调器并更改“最大值”值？

Answer 1

我想你可以在成功函数中添加这样的东西：

$('.spinner').each(function() {
  $(this).spinner().change(function() {
    $(this).spinner('option', 'max', $(this).spinner('value') + unusedPool);
  });
});

Answer 2

Kvam 的回答结果非常接近，但成功函数内的更新不会进入 spinner.change 回调内部（因为 .ajax 调用本身位于 .change 回调内部）。我最终发现这可以完成这项工作：

var unusedPool = 500;

jQuery(document).ready(function($) {
    var spinners = $('.spinner').each(function() {
        $(this).spinner({
            min: 0,
            max: (parseInt(this.value) + unusedPool),
            change: function(event, ui) {
                jQuery.ajax({
                    data: { newValue = this.value },
                    success: function(data) {
                        unusedPool -= data.change;
                        spinners.each(function() {
                            var newMax = parseInt(this.value) + unusedPool;
                            $(this).spinner({ max: newMax });
                        }
                    }
                });
            }
        });
    });