JavaScript实现A标签提交Form表单的三种方法

作者:微光

时间:2026-10-29

浏览:218

本文介绍在JavaScript中利用A标签触发Form表单提交的三种实现方式。通过为A标签绑定onclick事件或设置href属性,可调用document对象或getElementById获取表单元素后执行submit()方法,从而无需传统Submit按钮即可提交数据。

文章目录

A标签提交Form表单的三种实现方式

本文实例详细讲解了如何使用JavaScript通过A标签超链接来提交Form表单,供读者参考学习。具体实现方案如下所述:


<form action="/home/search" method="get" id="search_form">
<div class="searchBox png" id="searchBox">
<input type="text" id="searchTxt" class="searchTxt"
name="shopName" value="@shopName">
<a class="searchPic h-submitBtn png"
id="h-submitBtn" onclick="document:search_form.submit();">
</a>
</div>
</form>

针对A标签的实现,这里提供了以下几种不同的写法供选择:

第一种实现方式:

具体代码示例如下:

<a class="searchPic h-submitBtn png" id="h-submitBtn" onclick="document:search_form.submit();">提交</a>

第二种实现方式:

具体代码示例如下:

<a href="javascript:document:search_form.submit();">提交</a>

第三种实现方式:

具体代码示例如下:

<a class="searchPic h-submitBtn png" id="h-submitBtn" onclick="document.getElementById('search_form').submit();">提交</a>

希望上述关于JavaScript程序设计的介绍能对各位有所帮助。

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章