如何在提交前向表单添加其他字段？

有没有一种方法可以使用 javascript 和 JQuery 来添加一些额外的字段，以使用 POST 从 HTTP 表单发送？

我的意思是:

<form action="somewhere" method="POST" id="form">
<input type="submit" name="submit" value="Send" />
</form>


<script type="text/javascript">
$("#form").submit( function(eventObj) {
// I want to add a field "field" with value "value" here
// to the POST data


return true;
});
</script>
244758 次浏览
小开
最佳答案

是的，你可以尝试一些隐藏的参数。

  $("#form").submit( function(eventObj) {
$("<input />").attr("type", "hidden")
.attr("name", "something")
.attr("value", "something")
.appendTo("#form");
return true;
});
小开

试试这个:

$('#form').submit(function(eventObj) {
$(this).append('<input type="hidden" name="field_name" value="value" /> ');
return true;
});
小开

您可以添加一个 hidden input与您需要发送的任何值:

$('#form').submit(function(eventObj) {
$(this).append('<input type="hidden" name="someName" value="someValue">');
return true;
});
小开 
$('#form').append('<input type="text" value="'+yourValue+'" />');
小开

这种方法是有效的:

var form = $(this).closest('form');


form = form.serializeArray();


form = form.concat([
{name: "customer_id", value: window.username},
{name: "post_action", value: "Update Information"}
]);


$.post('/change-user-details', form, function(d) {
if (d.error) {
alert("There was a problem updating your user details")
}
});
小开

可能对某些人有用:

(一个允许您使用对象将数据添加到表单的函数，如果有的话，可以覆盖现有的输入)[纯 js ]

(form 是 dom el，而不是 jquery 对象[ 如果需要，可以使用(0)])

function addDataToForm(form, data) {
if(typeof form === 'string') {
if(form[0] === '#') form = form.slice(1);
form = document.getElementById(form);
}


var keys = Object.keys(data);
var name;
var value;
var input;


for (var i = 0; i < keys.length; i++) {
name = keys[i];
// removing the inputs with the name if already exists [overide]
// console.log(form);
Array.prototype.forEach.call(form.elements, function (inpt) {
if(inpt.name === name) {
inpt.parentNode.removeChild(inpt);
}
});


value = data[name];
input = document.createElement('input');
input.setAttribute('name', name);
input.setAttribute('value', value);
input.setAttribute('type', 'hidden');


form.appendChild(input);
}


return form;
}

用途:

addDataToForm(form, {
'uri': window.location.href,
'kpi_val': 150,
//...
});

你也可以这么用

var form = addDataToForm('myFormId', {
'uri': window.location.href,
'kpi_val': 150,
//...
});

你也可以添加 # (“ # myformid”)。

小开

扩展 Khawer 的回答，您可以避免使用 jQuery-为了保持一致性，例如。
<input type="hidden" name="field_name" value="value" />


提交答案