Question

我正在教我自己的php和mysql。我正在创建一个小型商业网站来测试我的技能。我在页面上有多种形式

<div class="formInfo"><form name="CartForm" method="post" action="./ajax/addCart.php" class="fixed">
<input name="prodId" type="hidden" value="10" />
  <label for="qty">Quantity:</label>

  <input name="qty" type="text" id="qty" size="4" maxlength="6" class="qtyBox">
  <br>
  <input type="submit" name="addtoCart" id="addtoCart" value="Add to Cart" class="btnAdd">
</form>



<div class="formInfo"><form name="CartForm" method="post" action="./ajax/addCart.php" class="fixed">
<input name="prodId" type="hidden" value="7" />
  <label for="qty">Quantity:</label>

  <input name="qty" type="text" id="qty" size="4" maxlength="6" class="qtyBox">
  <br>
  <input type="submit" name="addtoCart" id="addtoCart" value="Add to Cart" class="btnAdd">
</form>


<div class="formInfo"><form name="CartForm" method="post" action="./ajax/addCart.php" class="fixed">
<input name="prodId" type="hidden" value="9" />
  <label for="qty">Quantity:</label>

  <input name="qty" type="text" id="qty" size="4" maxlength="6" class="qtyBox">
  <br>
  <input type="submit" name="addtoCart" id="addtoCart" value="Add to Cart" class="btnAdd">
</form>

现在，当我点击sumbit按钮时，我想显示隐藏字段ID和可见字段qta（当前点击的表单）的值到目前为止，我的代码是

<script type="text/javascript">
$(document).ready(function(e) {
    $('.formInfo').submit(function() {
        alert($(this).val())
    });
});
</script>

我无法弄明白。如何告诉jquery我想要“this”引用的“id”和“qty”值而不是引用本身的值

Answer 1

首先，同一个HTML文档中不能有多个元素具有相同的id。您必须将其更改为qty1和qty2。您将事件绑定到<div>，而不是表单。您还需要选择输入元素。试试这个：

$(document).ready(function(e) {
    $('.formInfo form').submit(function() {
        $("input[type=hidden],input[name=qty]",this).each(function(){
            alert($(this).val());
        });
    });
});

Answer 2

如前面的答案中所述，ids应该是唯一的，您需要将提交绑定到不是div的表单，您可以通过表单元素的名称访问表单成员

$(document).ready(function(e) {
    $('.formInfo form').submit(function() {
        alert(this.prodId.value);
        alert(this.qty.value);
    });
});

FIDDLE

jquery从相同的表单中选择值

2 个答案: