如何设置 jQuery 微调器最大值和最小值？答案

【问题标题】：How to set jQuery spinner max and min values?如何设置 jQuery 微调器最大值和最小值？
【发布时间】：2012-08-04 07:20:25
【问题描述】：

我遇到了下一个问题：我正在使用 jQuery + ajax，我希望在从服务器获取数据后设置微调器的最大值和最小值。但实际情况是，当我用萤火虫检查元素时，它说设置了最大值和最小值，而实际上它们没有设置，所以没有最大值和最小值。这是一些代码：

...
<input type="number" id ="spinId" name="someName" step="0.5" />
...
$("#spinId").attr('min', 0.0);
$("#spinId").attr('max', parseFloat($('.someClass').text()));
...

这个 .someClass 是通过 ajax 形成的。我还注意到值设置正确，即$('#spinId').attr('value',ValueFromServer); 工作正常。那我应该怎么做才能解决呢？

【问题讨论】：

它似乎在 Chrome 中工作。 Firefox 还不支持输入类型数字，所以（根据分配给问题的标签判断）您正在使用 jspinner 来处理它？
我正在使用 jQuery 微调器：btburnett.com/spinner/example/example.html
你检查过（console.log 或 alert）$('.someClass').text() 的值吗？它是否提供了您期望的价值？

标签： javascript jquery ajax spinner

【解决方案1】：

min 和 max 值在创建微调器时设置。要即时更改它们，请使用以下命令：

// given a 'data' object from AJAX with keys 'min' and 'max':
$('#spinId').spinner('option', 'min', data.min);
$('#spinId').spinner('option', 'max', data.max);

还请记住，.attr() function 只能用于获取和设置 DOM 元素的属性。例如，您可以使用它来获取或设置<div> 的id 或<a> 元素的href。大多数 jQuery 插件将其配置保存在 JavaScript 变量中。如果他们确实将配置附加到 DOM，他们使用.data()。

【讨论】：

【解决方案2】：

您还可以直接在不同的微调器上设置选项，而不会影响默认值。这是工作示例：http://jsfiddle.net/7xj7K/4/

// give two different inputs different options without changing jquery spinner defaults
$("#spinId").spinner({min: 0, max: 10});
$("#spinId_two").spinner({min: -3, max: 53});

正如您在 jsfiddle 上看到的，jQuery 微调器在单击输入右侧的按钮时强制执行最小/最大值存在一些问题。该值可以超过最小/最大值，但一旦用户从字段中模糊就会验证。使用键盘上/下箭头时验证工作得很好，所以插件的作者似乎还有改进的空间。

【讨论】：

这是设置多个选项的绝佳方法。