jquery - AJAX 调用只能返回第一行

Question

请帮我找出为什么单击 inc 和 dec 按钮时只有第一行插入数据库表中。 我希望数据库在每次点击时立即更新每个输入，但只有第一项数据插入表中。即使当我单击另一个输入字段按钮时。

代码如下: ...

        <button class="btn btn-danger minus" name="item_1"><span class="glyphicon glyphicon-minus"></span></button>
        <input class="text-center" type="number" name="item_1" id="item_1" value="0" />
        <button class="btn btn-success plus" name="item_1"><span class="glyphicon glyphicon-plus"></span></button>
...

        <button class="btn btn-danger minus" name="item_2"><span class="glyphicon glyphicon-minus"></span></button>
        <input class="text-center" type="number" name="item_2" id="item_2" value="0" />
        <button class="btn btn-success plus" name="item_2"><span class="glyphicon glyphicon-plus"></span></button>

还有 jQuery:

    <script>
    jQuery(document).ready(function(){
    $('.plus').click(function(e){
        e.preventDefault();
        var id = $(this).attr('name');
        var currentVal = parseInt($('input[id='+id+']').val());
        if (!isNaN(currentVal)) {
            var newVal = $('input[id='+id+']').val(currentVal + 1);
        } else {
            var newVal = $('input[id='+id+']').val(0);
        }
    });
    $(".minus").click(function(e) {
        e.preventDefault();
        id = $(this).attr('name');
        var currentVal = parseInt($('input[id='+id+']').val());
        if (!isNaN(currentVal) && currentVal > 0) {
            var newVal = $('input[id='+id+']').val(currentVal - 1);
        } else {
            var newVal = $('input[id='+id+']').val(0);
        }
    });

$('button').click(function(){
var id = $('input').attr('id');
var newVal = $('input[id='+id+']').val();
$.ajax({
            type: 'POST',
            url: "update.php?pid="+id+"&qty="+newVal+"&uid="+id,
success: function() {
    $button.parent().find("input").val(newVal);
  }
});
});    
});
</script>

Answer 1

如果有人遇到同样的问题，解决方案如下: 将 var id = $('input').attr('id'); 更改为 var id = $(this).attr('name');

因为第一个从输入字段获取id，而正确的一个从单击的按钮获取id。