如何使用jQuery获取按钮前一个input输入框元素的当前值

问题原因 #

你调用$(this).prev(".inputNbArt")无法匹配到目标输入框，核心原因是节点层级关系不匹配：

• this指向触发点击事件的.ajoutPanier按钮，该按钮被包裹在<a>标签内部，它的同级节点不存在带有.inputNbArt类的元素，因此prev()返回空的jQuery对象，调用val()就会输出undefined
• 你要查找的.inputNbArt位于<form class="nbArticles">内部，这个form标签才是包裹按钮的<a>标签的前一个同级节点

正确实现代码 #

通过相对节点关系调整查找逻辑即可，示例如下：

$(".ajoutPanier").click(function(e) {
  // 可选：阻止a标签的默认锚点跳转行为
  e.preventDefault();
  // 先取按钮的父级a标签，再取a的前一个form节点，最后查找form内的输入框
  var nb = $(this).parent().prev(".nbArticles").find(".inputNbArt").val();
  console.log(nb); 
});

内容的提问来源于stack exchange，提问作者Samuel Carva