我正在编写一些 javascript(agreasemonkey/userscript),它将在网站上的表单中插入一些输入字段。
问题是,我不希望这些输入字段以任何方式影响表单,我不希望在提交表单时提交它们,我只希望我的 javascript 可以访问它们的值。
有什么方法可以在表单中间添加一些输入字段,而不是在提交表单时提交它们?
显然,理想的情况是输入字段不在表单元素中,但我希望结果页面的布局让我插入的输入字段出现在原始表单的元素之间。
我正在编写一些 javascript(agreasemonkey/userscript),它将在网站上的表单中插入一些输入字段。
问题是,我不希望这些输入字段以任何方式影响表单,我不希望在提交表单时提交它们,我只希望我的 javascript 可以访问它们的值。
有什么方法可以在表单中间添加一些输入字段,而不是在提交表单时提交它们?
显然,理想的情况是输入字段不在表单元素中,但我希望结果页面的布局让我插入的输入字段出现在原始表单的元素之间。
您可以插入没有“名称”属性的输入字段:
<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
文本字段,用户将无法选择文本。如果您有disabled
复选框,则用户无法更改其状态。
您还可以编写一些 javascript 来触发表单提交以删除您不想提交的字段。
简单的尝试从 input 元素中删除name属性。
所以它必须看起来像
<input type="checkbox" checked="" id="class_box_2" value="2">
我只想添加一个附加选项:在您的输入中添加表单标签并指定页面上不存在的表单的名称:
<input form="fakeForm" type="text" readonly value="random value" />
您可以编写一个事件处理程序,用于从您不希望包含在表单提交中的所有输入字段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;