停止提交表单中的输入字段

IT技术 javascript html forms userscripts
2021-02-05 08:58:20

我正在编写一些 javascript(agreasemonkey/userscript),它将在网站上的表单中插入一些输入字段。

问题是,我不希望这些输入字段以任何方式影响表单,我不希望在提交表单时提交它们,我只希望我的 javascript 可以访问它们的值。

有什么方法可以在表单中间添加一些输入字段,而不是在提交表单时提交它们?

显然,理想的情况是输入字段不在表单元素中,但我希望结果页面的布局让我插入的输入字段出现在原始表单的元素之间。

6个回答

您可以插入没有“名称”属性的输入字段:

<input type="text" id="in-between" />

或者您可以在提交表单后简单地删除它们(在 中jQuery):

$("form").submit(function() {
   $(this).children('#in-between').remove();
});
@kldavis4 - 似乎stripe (stripe.js) 和Braintree (braintree.js) [link] braintreepayments.com/docs/python/guide/getting_paid 使用“遗漏名称”属性概念来阻止数据到达服务器从而减少对“PCI”合规性的需求......如果你说正在发送“数据”,他们是否有错误?
2021-03-21 08:58:20
省略名称会阻止提交吗?酷,我不知道。这适用于所有浏览器吗?它是标准的一部分,还是实现的怪癖?
2021-04-01 08:58:20
我使用 chrome、firefox、safari 测试了省略 name 属性,似乎表单字段正在以空字符串作为名称提交到服务器。我使用 WebScarab 检查了 post 数据,发现数据正在发送。现在我想我将不得不禁用这些字段以防止它们被提交。
2021-04-10 08:58:20
@Acorn 我不完全确定,但值得一读。本质上,如果您省略“名称”属性值,您将无法通过任何方法访问该值……因此该值可能会被浏览器简单地丢弃。如果对您来说安全很重要,请选择 jquery/javascript 选项(请注意,当 javascript 被轻松禁用时,字段将被提交——所以不要依赖于您的任何安全机制)。
2021-04-11 08:58:20

最简单的方法是插入带有disabled属性的元素

<input type="hidden" name="not_gonna_submit" disabled="disabled" value="invisible" />

这样,您仍然可以将它们作为表单的子项访问。

禁用字段的缺点是用户根本无法与它们交互 - 因此,如果您有disabled文本字段,用户将无法选择文本。如果您有disabled复选框,则用户无法更改其状态。

您还可以编写一些 javascript 来触发表单提交以删除您不想提交的字段。

添加禁用将不允许选择字段是可选的。
2021-03-17 08:58:20
这个想法是让我插入的字段可用,以便用户可以更改复选框等,然后将它们提交给我的 javascript。
2021-04-01 08:58:20
当您必须使用 AJAX 提交表单并且不想从表单中删除您的输入或删除它们的name属性时,这非常有用。
2021-04-05 08:58:20
如果您仅在提交时禁用字段或基于选中的复选框禁用字段,则禁用仍然可以工作。这样你就不仅仅是扔掉了name财产,如果你想以后使用它,你可能想要保留它。
2021-04-07 08:58:20

简单的尝试从 input 元素中删除name属性。
所以它必须看起来像

<input type="checkbox" checked="" id="class_box_2" value="2">
这应该是答案:))
2021-03-30 08:58:20
这适用于复选框。但是请注意,当与单选按钮一起使用时,这将破坏其他单选按钮的自动取消选择。
2021-04-02 08:58:20

我只想添加一个附加选项:在您的输入中添加表单标签并指定页面上不存在的表单的名称:

<input form="fakeForm" type="text" readonly value="random value" />
如果您不想添加 javascript 并且您需要表单内的输入与用户交互。从我的角度来看,这是迄今为止最简单的解决方案。
2021-03-23 08:58:20
注意:此解决方案不适用于 IE在这里查看
2021-03-23 08:58:20
虽然这可能有效(尚未测试),除非您实际fakeForm在其他地方定义(无需提交),否则会导致 HTML 无效。
2021-04-04 08:58:20

您可以编写一个事件处理程序,用于从您不希望包含在表单提交中的所有输入字段onsubmit中删除该name属性。

这是一个未经测试的快速示例:

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;
radio如果没有该name属性,某些类型的输入(例如)将无法正常工作
2021-03-16 08:58:20