Javascript 电子商务中的增值字段问题

以下代码位于文件

/WooCommerce/templates/global/quantity input.php

（使用Wordpress和WooCommerce构建）中，我添加了一些代码以获得几个“增值”按钮。每个按钮应将数量值增加其旁边字段的1

问题是，所有按钮只增加第一个顶部字段值

我希望每个按钮只与它旁边的字段交互，而不反映其他字段

我做错了什么？
请帮帮我

echo”
var i=0；
函数按钮单击（）{
document.getElementById（'inc'）。值=++i；
";
如果（！已定义（'ABSPATH'））{
exit；//如果直接访问，则退出
}
?>
调用document.getElementById（'inc'）时，它会获取id为“inc”的第一个输入。因此它会更新该输入字段。您需要输入字段的唯一id，或者找到另一种方法来查找要更新的正确输入字段

echo "<script>

var i = 0;
    function buttonClick(id) {
        document.getElementById(id).value = ++i;
</script>";




if ( ! defined( 'ABSPATH' ) ) {
    exit; // Exit if accessed directly
}
?>
<div class="quantity">
<form>
    <input  type="number" id="inc1" onfocus="if(this.value == '0') { this.value = ''; }" step="<?php echo esc_attr( $step ); ?>" min="<?php echo esc_attr( $min_value ); ?>" max="<?php echo esc_attr( $max_value ); ?>" name="<?php echo esc_attr( $input_name ); ?>" value="<?php echo esc_attr( $input_value ); ?>" title="<?php echo esc_attr_x( 'Qty', 'Product quantity input tooltip', 'woocommerce' ) ?>" class="input-text qty text" size="4" />
    <input type="button" onclick="buttonClick("inc1")" value="Increment Value" />
    </form>
</div>

echo”
var i=0；
功能按钮单击（id）{
document.getElementById（id）.value=++i；
";
如果（！已定义（'ABSPATH'））{
exit；//如果直接访问，则退出
}
?>
您需要这样的东西，在调用函数时传递输入的id，并增加在函数中传递id的输入的值

这很有效，试试看


功能按钮点击（id）
{
var val=document.getElementById（id）.value；
document.getElementById（id）.value=++val；
}
谢谢亲爱的@LoicTheAztec