因此，我用javascript呈现了一个add minus按钮，因为我需要数据库中的数据，如果我不用javascript呈现它，它可以工作，但它不工作。

HTML：

<div id="cart">
  <div class="row">

  </div>  
</div>

JS（渲染）：

var output = [];
var food_template = [];
//res is the data got from database
for(var f in res) {
  id = res[f]["id"];
  name = res[f]["name"];
  description = res[f]["description"];
  price = res[f]["price"];
  food_template = [
    '<div class="col-6">',
    '    <div class="single_food_item media">',
    '        <div class="media-body", style="margin-right:10px; margin-top: 20px; height: 200px">',
    `            <h3>${name}</h3>`,
    `            <p>${description}</p>`,
    `            <h5>$${price}</h5>`,
    //add minus button starts
    '            <div class="input-group" style="width:50%">',
    '                <span class="input-group-btn">',
    '                    <button class="btn btn-danger btn-minus" type="button">-</button>',
    '                </span>',
    '                <input type="text" class="form-control no-padding add-color text-center height-25" maxlength="3" value="0">',
    '                <span class="input-group-btn">',
    '                    <button class="btn btn-success btn-plus" type="button">+</button>',
    '                </span>',
    '            </div>',
    //add minus button ends
    '        </div>',
    '    </div>',
    '</div>'
  ];
  output.push(food_template.join("\n"));
}
("#cart .row").html(output.join("\n"));

JS（加减按钮）：

$('#cart .row').delegate('.btn-minus', 'click', function(){
  $(this).parent().siblings('input').val(parseInt($(this).parent().siblings('input').val()) - 1);
});

$('#cart .row').delegate('.btn-minus', 'click', function(){
  $(this).parent().siblings('input').val(parseInt($(this).parent().siblings('input').val()) + 1)
});

（调用所有函数）

我的测试使我认为问题可能是val（）函数没有改变输入HTML的值，因为如果我使用console.log来显示它，它可以工作，但它不会在web上更新