停止提交表单中的input字段
我正在写一些JavaScript（一个greasemonkey / userscript），将一些input字段插入到网站上的表单。
事情是，我不希望那些input字段以任何方式影响表单，我不希望他们在提交表单时提交，我只希望我的JavaScript有权访问它们的值。
有什么办法可以将一些input字段添加到表单的中间，而不是在提交表单时提交？
很显然，理想的情况是input字段不在表单元素中，但是我希望我的结果页面的布局能让我插入的input字段出现在原始表单的元素之间。
您可以插入没有“名称”属性的input字段：
<input type="text" id="in-between" /> 或者你可以简单地删除他们的表单提交（在jQuery中）：
$("form").submit(function() { $(this).children('#in-between').remove(); });
最简单的做法是插入带有disabled属性的元素。
<input type="hidden" name="not_gonna_submit" disabled="disabled" value="invisible" />
这样你仍然可以作为窗体的子项访问它们。
被禁用的字段有缺点，即用户根本无法与它们进行交互，所以如果您有disabled文本字段，用户将无法select文本。 如果您有disabledcheckbox，则用户无法更改其状态。
你也可以在表单提交时写一些JavaScript来删除你不想提交的字段。
您可以为onsubmit编写一个事件处理程序，从所有您希望不包含在表单提交中的input字段中删除name属性。
以下是一个未经testing的例子：
var noSubmitElements = [ 'someFormElementID1', 'someFormElementID2' ]; //... function submitForm() { for( var i = 0, j = noSubmitElements.length; i < j; i++ ) { document.getElementById(noSubmitElements[i]).removeAttribute('name'); } } form.onsubmit = submitForm;
简单的尝试从input元素中删除名称属性。
所以它看起来像
<input type="checkbox" checked="" id="class_box_2" value="2">
我只是想添加一个额外的选项：在您的input添加表单标签，并指定您的网页上不存在的表单的名称：
<input form="fakeForm" type="text" readonly value="random value" />
在input中添加disabled =“disabled” ，而当jquery使用.removeAttr（'disabled'）提交时，删除禁用的属性
HTML：
<input type="hidden" name="test" value="test" disabled='disabled'/>
jQuery的：
$("input[name='test']").removeAttr('disabled');
我知道这个post是古老的，但我会回复。 我find的最简单/最好的方法只是简单地将名称设置为空白。
把这个提交之前：
document.getElementById("TheInputsIdHere").name = "";
总之你的提交函数可能看起来像这样：
document.getElementById("TheInputsIdHere").name = ""; document.getElementById("TheFormsIdHere").submit();
这将仍然提交与您的所有其他领域的forms，但不会提交一个没有名字。
在函数中通过onSubmit（）处理表单的提交，并执行下面的操作来删除表单元素：使用DOM的getElementById() ，然后使用[object].parentNode.removeChild([object])
假设你的字段有一个id属性“my_removable_field”代码：
var remEl = document.getElementById("my_removable_field"); if ( remEl.parentNode && remEl.parentNode.removeChild ) { remEl.parentNode.removeChild(remEl); }
这将让你正是你在找什么。
你甚至需要把它们作为input元素吗？ 您可以使用Javascript来dynamic创builddiv或段落或列表项目或任何包含您想要提供的信息。
但是，如果交互式元素很重要，并且将这些元素放置在<form>块之外是个痛处，那么应该可以在提交页面时从表单中移除这些元素。
$('#serialize').click(function () { $('#out').text( $('form').serialize() ); }); $('#exclude').change(function () { if ($(this).is(':checked')) { $('[name=age]').attr('form', 'fake-form-id'); } else { $('[name=age]').removeAttr('form'); } $('#serialize').click(); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form action="/"> <input type="text" value="John" name="name"> <input type="number" value="100" name="age"> </form> <input type="button" value="serialize" id="serialize"> <label for="exclude"> <input type="checkbox" value="exclude age" id="exclude"> exlude age </label> <pre id="out"></pre>
您需要在表单中添加提交内容：
<form action="YOUR_URL" method="post" accept-charset="utf-8" onsubmit="return validateRegisterForm();">
而剧本将是这样的：
function validateRegisterForm(){ if(SOMETHING IS WRONG) { alert("validation failed"); event.preventDefault(); return false; }else{ alert("validations passed"); return true; } }
这对我来说每次:)
