如何使用jQuery获取变量输入类值？

Question

希望你们都做得很好。

我正在建立一个网上商店＆＃39;我需要计算用户想要购买的物品数量。商店将有 n 表单，其中包含一个输入和一个按钮，用于将对象发送到购物车。

我应该为点击的特定按钮获取输入，这是用户想要购买的项目数。它应该类似于$(this).val() input，但我不确定应该如何编写代码。

以下是代码：

    <div class="row">
  <div class="col s4">
    <div class="card small">
      <div class="card-image">
        <img src="animal.jpg">
        <span class="card-title">Kesha - Animal (CD)</span>
      </div>
      <div class="card-content animal">
        <form style = "display: flex; justify-content: space-between; flex-wrap: wrap;">

          <input type = "number" class = "qntd" placeholder="Quantidade" style = "width: 100%; margin-top: -20px;" maxlength="10">

          <button class="btn waves-effect waves-light" type="submit" name="action" value = "animal">Adicionar ao saco
            <i class="material-icons right">attach_money</i>
          </button>

        </form>
      </div>
    </div>
  </div>

  <div class="col s4">
    <div class="card small">
      <div class="card-image">
        <img src="cannibal.jpg">
        <span class="card-title">Kesha - Cannibal (CD)</span>
      </div>
      <div class="card-content cannibal">
        <form style = "display: flex; justify-content: space-between; flex-wrap: wrap;">

          <input type = "number" class = "qntd" placeholder="Quantidade" style = "width: 100%; margin-top: -20px;" maxlength="10">

          <button class="btn waves-effect waves-light" type="submit" name="action" value = "cannibal">Adicionar ao saco
            <i class="material-icons right">attach_money</i>
          </button>

        </form>
      </div>
    </div>
  </div>

我的JavaScript：

$("button").click(function() {
  event.preventDefault();

  let animal = $('.animal button').val();
  let animalqntd = $('.animal .qntd').val();

  let cannibal = $('.cannibal button').val();
  let cannibalqntd = $('.cannibal .qntd').val();

  localStorage.setItem($(this).val(), $('$(this).val() input').val());
  console.log(localStorage.getItem($(this).val()));
});