我有一个链接而不是“提交”按钮:
<form> <a href="#"> submit </a> </form>
单击后可以提交表单吗?
最好的方法是插入适当的输入标签:
<input type="submit" value="submit" />
<form id="form-id"> <button id="your-id">submit</button> </form> var form = document.getElementById("form-id"); document.getElementById("your-id").addEventListener("click", function () { form.submit(); });
由封闭后的JavaScript代码DOMContentLoaded事件(只选择load了向后兼容性如果你还没有这样做:
DOMContentLoaded
load
window.addEventListener("DOMContentLoaded", function () { var form = document.... // copy the last code block! });
onclick在链接和id表单中添加一个属性:
onclick
id
<form id="form-id"> <a href="#" onclick="document.getElementById('form-id').submit();"> submit </a> </form>
无论选择哪种方式,formObject.submit()最终都可以调用(标记formObject的DOM对象在哪里<form>)。
formObject.submit()
formObject
<form>
您还必须绑定这样的事件处理程序,该事件处理程序调用formObject.submit(),因此在用户单击特定的链接或按钮时将调用该事件处理程序。有两种方法:
// 1. Acquire a reference to our <form>. // This can also be done by setting <form name="blub">: // var form = document.forms.blub; var form = document.getElementById("form-id"); // 2. Get a reference to our preferred element (link/button, see below) and // add an event listener for the "click" event. document.getElementById("your-id").addEventListener("click", function () { form.submit(); });
不推荐: 插入内联JavaScript。有几种原因导致不推荐使用此技术。一个主要的论点是将标记(HTML)与脚本(JS)混合在一起。该代码变得杂乱无章,难以维护。
<a href="#" onclick="document.getElementById('form-id').submit();">submit</a>
submit
现在,我们到了必须确定触发Submit()调用的UI元素的地步。
一个按钮
<button>submit</button>
一条链接
<a href="#">submit</a>
应用上述技术以添加事件侦听器。