栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

如何通过单击链接使用JavaScript提交表单?

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

如何通过单击链接使用JavaScript提交表单?

最好的方式

最好的方法是插入适当的输入标签:

<input type="submit" value="submit" />

最好的JS方式

<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
了向后兼容性如果你还没有这样做:

window.addEventListener("DOMContentLoaded", function () {  var form = document.... // copy the last pre block!});

简单而不可取的方式(以前的答案)

onclick
在链接和
id
表单中添加一个属性:

<form id="form-id">  <a href="#" onclick="document.getElementById('form-id').submit();"> submit </a></form>

所有方式

无论选择哪种方式,

formObject.submit()
最终都可以调用(标记
formObject
的DOM对象在哪里
<form>
)。

您还必须绑定这样的事件处理程序,该事件处理程序调用

formObject.submit()
,因此在用户单击特定的链接或按钮时将调用该事件处理程序。有两种方法:

  • 推荐: 将事件侦听器绑定到DOM对象。
// 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()调用的UI元素的地步。

  1. 一个按钮

    <button>submit</button>
  2. 一条链接

    <a href="#">submit</a>

应用上述技术以添加事件侦听器。



转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/451925.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号