点击按钮时获取关联输入框值与元素ID的jQuery实现方法

你之前的代码拿不到目标元素，是DOM层级匹配错了：
按钮被包裹在第二个<td>节点内，执行$(this).parent()时拿到的是按钮所在的td容器，再调用.prev()拿到的是和这个td相邻的上一个td（也就是包裹input的td容器），并没有选中input元素本身，自然读不到id或者value属性。

针对你这种表格行内重复的「按钮-输入框」关联结构，优先用锚定共同父级再查找目标元素的写法，抗结构变动能力强，多组重复元素不用单独绑定事件：

// 绑定按钮点击事件，动态渲染的行可以把事件委托到table上，兼容后续新增的行
$('table').on('click', 'button[type="button"]', function() {
  // 先向上查找，锚定按钮所在的当前表格行，这是两个元素共有的最近父级
  const $currentTr = $(this).closest('tr');
  // 在当前行范围内查找输入框，自动匹配本行对应的input，不用硬编码id
  const $bindInput = $currentTr.find('input');

  // 以下是你需要的操作逻辑
  // 获取输入框id
  const inputId = $bindInput.attr('id');
  // 读取输入框当前数值，注意转数字类型避免字符串拼接bug
  const oldVal = Number($bindInput.val());
  // 替换成你自己的计算逻辑，示例为数值翻倍
  const newVal = oldVal * 2;
  // 将计算结果写回输入框
  $bindInput.val(newVal);
})

写法说明 #

• 不要写过长的链式parent()调用：比如$(this).parent().prev().find('input')这种写法完全依赖当前固定的td相邻结构，只要后续你在按钮外面套一层标签、或者调整td顺序，代码就会直接失效。
• 用closest('tr')锚定共同父级的写法不受内部嵌套结构影响，只要按钮和对应输入框在同一行，不管中间加多少层包裹元素都能正常匹配，多组重复tr结构下也不用单独给每个按钮、输入框写选择器，维护成本低。

基于你原有代码的修正版（不推荐长期用） #

如果只是临时改现有代码生效，只需要在你原来的链式调用最后补一层查找input的逻辑即可：

alert($(this).parent().prev().find('input').attr('id'));

内容的提问来源于stack exchange，提问作者Derek Jee