[英]How can I send a variable to a form using this javascript function?
我有这个onclick电话:
onClick="mySubmit();
调用此函数:
function mySubmit(){
document.getElementById("myForm").submit();
}
然后提交此表单:
<form id="myForm" action="action.php" method="post">
我的问题是:如何从onClick向表单发送变量以获得类似<form id="myForm" action="action.php?id=**(the variable sent from the onclick goes here)**" method="post">
谢谢!
最简单的方法:在表单中附加隐藏字段。
<form id="myForm" action="action.php" method="post">
<input type='hidden' id= 'hiddenField' name='id' value='' />
<script>
function mySubmit() {
document.getElementById('hiddenField').value = "Whatever I want here";
document.getElementById("myForm").submit();
}
</script>
或者使用像这样的功能
function addHiddenField(form, props) { Object.keys(props).forEach(fieldName => { var field = form[fieldName]; if (!field) { field = document.createElement('input'); field.type = 'hidden'; field.name = fieldName; form.appendChild(field); } field.value = props[fieldName]; }); } document.querySelector('form').addEventListener('submit', () => { addHiddenField(this, { someQueryName: 'someQueryValue', otherQueryName: 'otherVal' }); });
<form> Name <input name=name /> <input type=submit /> </form>
请注意,您可以使用DevTools修改iframe的沙箱以允许其提交表单,并且您可以验证发布的URL。 sandbox="... allow-forms"
将输入类型隐藏在表单内,然后提交表单
<input id="id" name="id" type="hidden" />
在javascript submit()中设置隐藏字段的值
document.getElementById('id').value = **;
但是通过设置form method =“post”,id不会是查询字符串的一部分,即如果你真的想要查询字符串中的id,那么url将保留action.php,即url action.php?id = **那么你需要更改form method =“get”,这样隐藏的字段id会自动成为url的一部分,即action.php?id = **
如果你真的需要使用method =“post”action =“action.php”, 这里是你如何访问下一页的发布值
你的HTML:
<form id="myForm" action="#" method="post">
<input type='hidden' id="id" name='id' value='123' />
<input type='submit' name='submit' value='Click me !' onclick='addParam()' />
</form>
你的脚本:
function addParam() {
var url = "action.php?id=" + document.getElementById('id').value;
document.getElementById("myForm").setAttribute('action', url);
}
谢谢。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.