根据表单中的值动态更改表单提交按钮？

Question

这应该很容易，但是在浏览了几个库（jquery 首选！）甚至普通的旧 JavaScript 后，我​​一片空白。

换句话说，一行有 3 个编辑框，其中 2 个预先填充了奶酪和泡菜的类型，然后是一个未填充的数字框，右侧有一个提交按钮。 重复n次n行。

换句话说： 想象一下，一个表单呈现为搜索结果中的一系列行。 假设有 8 个结果，即 8 行。用户可以将他们的选择保存到 100 个“槽”中的任意一个中。 如果每一行都可以有一个名字或字母，那就很容易了；我只是将每个提交按钮称为一个数字，从 1 到 8，当按下 6 时，它知道它要保存的是第 6 行。它使用 Malsup 的 jquery 表单以 ajaxy 方式提交，这样表单就不必每次都刷新。

但这不允许自由选择结果保存在哪个“槽”中。如果我能让提交按钮反映其左侧单元格中的数字，我就会离开。

但我不能，所以我不是。而我似乎是唯一一个做出这种无稽之谈的人。 还有更好的办法吗？

Answer 1

我们假设您的提交按钮是一个按钮元素。

$('table').delegate('button', 'click', function(e) {

  var formData = {}

  $(this).closest('tr').find('input').each(function() {
    formData[this.name] = this.value;
  });

  //Add in your code to ajax it off...

  e.preventDefault(); //since buttons/submits behave differently in each browser.

});

//现在你的所有formData都在一个对象中。通过您的 Ajax 设备发送它。