多个微调器元素？

Question

我想在我的购物车上有微调元素来选择数量。像这个： http://jqueryui.com/spinner/

问题是微调器布局应用于 id="spinner" 的输入字段，但我怎样才能有多个输入字段，每个产品一个？

这样做只有第一个字段会有微调器布局：

<form action="shopping:cart.php" >
quantity 1: <input  id="spinner"><br>
quantity 2: <input  id="spinner"><br>
<input type="submit" value="Submit">
</form>

Answer 1

你不能有重复的id属性，因为这意味着页面的HTML是无效的，并且会导致JS出现问题。

改为使用类进行分组：

<form action="shopping:cart.php" >
    quantity 1: <input class="spinner"><br>
    quantity 2: <input class="spinner"><br>
    <input type="submit" value="Submit">
</form>

然后你需要改变你的 jQuery 选择器来识别这个类：

$('.spinner').spinner();