文档章节

html中a连接触发表单提交

Reya滴水心
 Reya滴水心
发布于 2015/08/18 19:01
字数 381
阅读 1203
收藏 1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>test</title>
</head>
<body>

<a href = "javascript:;" onclick ="add('a','aa');">aaaaaa1</a><br />
<a href = "javascript:;" onclick ="add('b','b');">aaaaaa2</a><br />
<a href = "javascript:;" onclick ="add('c','c');">aaaaaa3</a><br />

<form action="test.php" method="post" name="argform" id="argform">
    <input type="hidden" name="a" id="a" value="a"/>
    <input type="hidden" name="b" id="b" value="b"/>
    <input type="hidden" name="c" id="c" value="c"/>
    <input type="submit" name="argsubmit" style="display:none"/>
</form>

<script type="text/javascript">
function add(key,value)
{
    document.getElementById(key).value = value;
    document.getElementById("argform").submit();
    //document.argform.submit();
    //document.getElementById("argsubmit").click();
}
</script>

</body>
</html>

注意:
①a连接中的href属性不能为空,不能为URL地址(为空相当于URL是本脚本的URL地址),这样会先提交到form表单中的action,再跳转到a标签中指定的地址,即使a标签中的超链接地址和form表单中的URL地址相同,也不能得到form表单的值

(我猜是)因为这相当于两次进入该页面:第一个是通过form跳转进入,第二个是通过a标签跳转。第二次的跳转将post清空了所以得不到值

②虽然form表单的提交是通过js触发的,但是form标签中也必须有<input type = "submit" .... />

③js触发提交有两种方法:触发form的submit();事件 || 触发提交按钮(submit)的click();事件。两个都可以我试过了


本文转载自:http://www.cnblogs.com/iLoveMyD/archive/2012/08/16/2642115.html

Reya滴水心
粉丝 40
博文 88
码字总数 34619
作品 0
深圳
前端工程师
私信 提问
使用onbeforeunload事件检测窗口是否刷新或关闭

onunload,onbeforeunload 在页面刷新或关闭时调用,区别在于: onbeforeunload 是在页面刷新或关闭前触发,这时浏览器并未请求服务器读取新页面,因此onbeforeunload是可以阻止页面更新或关...

蜗牛奔跑
2016/03/07
94
0
Phonegap 事件机制

PhoneGap事件包含另个部分,一个是传统网页触发的事件,比如DOM加载,超链接,form表单提交事件等。 另一个是PhoneGap独有的事件。如 deviceready:只在设备在本地环境和页面完全加载后触发。...

zting科技
2017/10/12
0
0
表单提交和超链接请求传递参数的几种方式

表单提交和超链接请求传递参数的几种方式 转载 http://blog.csdn.net/Sky786905664/article/details/73770785 这段时间在使用easy-ui的datagrid,他有自己提交表单的方式,所以就整理整理页面...

不空大的Timo
2017/11/10
0
0
EasyNVR无插件流媒体服务器前端技术防止重复提交的方法

现在随着接触EasyNVR时间越来越长,越发的觉得EasyNVR真的是一个“神器”。从功能上来说自身不仅可以拉出来使用(具体功能搜索EasyNVR一定有惊喜!),也可以作为设备端与第三方平台接入使用。从...

xiejiashu
2017/11/28
0
0
如何在JavaScript中使用自定义事件

JavaScript 的事件处理是所有浏览器端程序的基本必备技巧。当目标元素的事件被触发时,比如按钮被点击,鼠标移动,或者是表单提交,这些事件触发时都可以触发对应的方法。当然这个过程中我们...

junwong
2012/07/19
4.2K
8

没有更多内容

加载失败,请刷新页面

加载更多

安全组和云防火墙的区别

前言 熟悉云平台的朋友可能都会注意到这样一个事情:无论公有云还是私有云,创建虚拟机的时候都需要选择安全组,来对虚拟机进行安全防护;有的云平台在VPC里,还能选择防火墙,ZStack在3.6版...

ZStack社区版
30分钟前
2
0
教育性app开发的重要性和好处

在这个精通技术的世界中,流行的app主导着无聊的教育系统。当我们将技术和教育结合在一起时,它将带来当代以及强大的学习资源。因此,将教育移动app集成到您的学习过程中,并根据自己的信念把...

a429011717
31分钟前
3
0
IE6/7/8如何兼容CSS3属性

本文转载于:专业的前端网站➩IE6/7/8如何兼容CSS3属性 最近在工作中总是要求IE8兼容CSS3属性,在网上搜了搜主要是引入了一个htc文件(ie-css3.htc或者PIE.htc。个人认为这两个文件的作用差不...

前端老手
46分钟前
4
0
手把手教你ALLEGRO的约束规则的设置教程!

约束规则的设置 分三步, 定义规则(一、基本约束规则设置:1、线间距设置;2、线宽设置;3、设置过孔;4、区域约束规则设置;5、设置阻抗;6、设置走线的长度范围;7、设置等长:7.1、不过电阻的NET 等...

demyar
48分钟前
5
0
完美解决H5滚动滑动穿透方案:不使用系统滚动

网上有很多黑科技解决这个问题,都不是从根本去解决,例如通过js控制弹出时html加上position:fixed; 弹窗关闭后再去掉该样式,总觉得不太对,像是打补丁。 今天终于找到了滚动穿透的原因和完...

未来cc
53分钟前
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部