实际上是否可以像这样拆分标签：

Question

实际上是否可以像这样拆分标签：

带有ComboBox字段的表单（使用onchange提交）

一些随机内容

另一个带有ComboBox的表单（使用onchange提交）

如果我改变一个盒子的状态，它实际上是否可以将数据一起发送？

Answer 1

HTML 5引入了form和其他表单控件的input属性，它允许元素成为表单的一部分，而不会实际出现在其中。

<input form="form_id" name="foo">

浏览器支持仍然是somewhat limited，所以你可能最好只是让表单包含中间内容。

如果你想添加JavaScript，那么（当提交任何一个表单时）你可以循环遍历第二个表单中的所有表单控件并将它们附加到第一个表单。然后第二种形式将触发第一种形式的提交。

（未测试的）

var form1 = document.getElementById('f1');
var form2 = document.getElementById('f2');

function copy() {
    for (var i = 0; i < form2.elements.length; i++) {
        var inp = document.createElement('input');
        inp.type = "hidden";
        inp.name = form2.elements[i].name;
        inp.value = form2.elements[i].value;
        form1.appendChild(inp);
    }
}

form1.addEventListener('submit', copy);
form2.addEventListener('submit', function (e) {
    e.preventDefault();
    copy();
    form1.submit();
});

只是让表单足够大以容纳所有控件仍然是最简单和最可靠的方法。

Answer 2

可能的解决方案可能是使用jQuery在目标表单提交时将表单的数据附加到另一个表单。另一个选择是使用.serialize（）函数并将两个表单数据一起添加，然后通过aJax提交表单。

但是，此解决方案的一个缺点是，当从客户端禁用java时，它将无法工作。

一个简单的模板是：

jQuery("#form1").submit(function() {
  //option 1 - add form 2 data to form 1.
  //option 2 -it is possible to use .serialize() function as well, just add two form value after .serialize() together and send the form via aJax.
})

是否可以在页面上拆分<form>标签？

实际上是否可以像这样拆分标签：

2 个答案: