javascript错误："；无法读取属性'；价值'；“无效”的定义；关于多输入的输入微调器

我遇到了一个问题，我需要在同一页面上的多个项目（具有唯一id）上使用数量微调器

例如：

这就是我正在使用的javascript，当只有一个输入具有给定的id（产品数量）时，它可以完美地工作。但是当我有多个项目时，它们每个都有唯一的id（当然），所以失败了

function updateSpinner(obj)
{
    var contentObj = document.getElementById("product_quantity");
    var value = parseInt(contentObj.value);
    if(obj.id == "down") {
        value--;
    } else {
        value++;
    }
    contentObj.value = value >= 1 ? value : 1;
}

（此小提琴上的示例：）

我正在处理的单个元素的HTML：

<div class="quantity-controls">
    <a class="button" id="down" onclick="updateSpinner(this);">...</a>
    <input type="text" name="quantity" id="product_quantity" value="1">
    <a class="button" id="up" onclick="updateSpinner(this);">...</a>
</div>

---

好的，因为您在html中使用onclick事件处理程序，所以可以执行如下操作：

函数更新内部（元素、对象）
{
value=parseInt（对象值）；
如果（元素id.indexOf（“向下”）>-1）{
价值--；
}否则{
值++；
}
对象值=值>=1？值：1；
}

a
{
文字装饰：无；
宽度：30px；
高度：30px；
颜色：白色；
背景：绿色；
显示：内联块；
边界半径：50%；
文本对齐：居中；
线高：30px；
}

您需要将+和-按钮与显示计数的相关输入相关联。我使用了一个链接到ID的数据属性，这样布局就独立于脚本，还有其他方法。您还可以使用数据属性来确定是添加到总数还是从总数中减去

可能要动态添加侦听器，下面的示例使用内联侦听器

函数更新（元素，num）{
var target=document.getElementById（element.dataset.id）；
var值；
如果（目标）{
value=parseInt（target.value）+parseInt（num）；
//不允许低于零度
target.value=值>-1？值：0；
}
}

第1项：+-


项目2：+-


项目2:+-

如何知道应该选择哪个元素？可能会将正确的元素作为参数传递？抱歉，我不太了解javascript，但这就是问题所在，即“product_quantity”不是每个元素的有效id。。。如何将正确的元素作为参数传递？这取决于如何调用

updatesinner

。我可以提供哪些进一步的信息？同样，我只知道很少的javascript…传递相应的输入元素可以像

updateSpiner（this，this.nextElementSibling）一样简单和
更新内部（this，this.previousElementSibling）
，但请注意，
nextElementSibling
和
previousElementSibling
在IE8及以下版本中不受支持。更多信息：。
<input type="text" class="qty-val" name="quantity[01]" id="product_quantity_01" value='1'>
<input type="text" class="qty-val" name="quantity[02]" id="product_quantity_02" value='1'>

function updateSpinner(obj)
{
    var contentObj = document.getElementsByClassName("qty-val");
    var value = parseInt(contentObj.value);
    if(obj.id == "down") {
        value--;
    } else {
        value++;
    }
    contentObj.value = value >= 1 ? value : 1;
}