type='button'和'submit'的区别
今天在对表单的项目进行删除时出现了问题,原因就出现在点击input按钮时,这个input属性是type='button'还是type=‘submit'。
代码大致如下:
<script type="text/javascript">
//获得选中文件的文件名
function GetCheckfolderItem() {
var allSel = '';
if (document.form1.deleteid.value) //如果document.form1.deleteid不是数组,只是一个元素,那么直接返回这个元素的值
{
return document.form1.deleteid.value;
}
for (i = 0; i < document.form1.deleteid.length; i++) //length属性可获取数组中元素的个数
{
if (document.form1.deleteid[i].checked) {
if (allSel == ''){ allSel = document.form1.deleteid[i].value;}
else { allSel = allSel + "," + document.form1.deleteid[i].value;}
}
}
return allSel;
} function DoSubmit(myfolder) {
var selid = GetCheckfolderItem(); //获取选中邮件的id
if (selid == '') {
alert("你没选中任何信息!");
return false;
}
if (window.confirm("你确定要删除这些消息么?")) {
location = "pm.php?dopost=del&ids=" + selid + "&folder=" + myfolder; //folder判断要删的是收件箱还是发件箱的邮件
}
}
</script>
<form action="pm.php" method="post" name="form1">
<input type='hidden' name='dopost' value='del' />
<table>
<tr>
<th>标题</th>
<th>收件人</th>
<th>状态</th>
<th>发送时间</th>
</tr>
{dede:datalist}<!--遍历邮件-->
<tr>
<td>
<input name="deleteid" type="checkbox" value="{dede:field.id/}" /> 一个邮件
</td>
<td>mqiang02</td>
<td>已阅读</td>
<td>2013-7-7</td>
</tr>
{/dede:datalist}
<tr>
<td>
<input type="submit" value="删除选中" onclick="DoSubmit('<?php echo $folder; ?>')"/>
<button type="button" onclick="DoSubmit('<?php echo $folder; ?>')">删除选中</button>
</td>
</tr>
</table>
</form>
先在pm.php中下一个断点die();阻止pm.php对页面的重定向。
结果当我选中某个邮件后,单击第一个按钮时,浏览器的url是:http://localhost/dede/member/pm.php(所选邮件无法删除)
单击第二个按钮时,浏览器的url是:http://localhost/dede/member/pm.php?dopost=del&ids=10&folder=outbox(邮件正常删除)
通过比较可知type='submit'只执行提交表单这一操作,没有执行location这个跳转链接;而type='button'则在执行完onclick()后,跳转文件在 js文件里控制。
type='button'和'submit'的区别的更多相关文章
- button 和 submit 的区别
表单提交中button和submit的区别submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了,submit和button,二者都以按钮的形式展现,看起来都是按钮, ...
- 在jQuery ajax中按钮button和submit的区别分析
在使用jQuery ajax的get方法进行页面传值,不能用submit,否则无刷新获取数据展示 点击submit提交按钮,sendPwd.php通过$_POST接收传过来的值,然后echo一段数据. ...
- input button 与 submit 的区别
在表单中,我们会经常提交数据,通常使用<input type="submit" value="提交"/>进行提交数据, 另一种方式是使用<bu ...
- 2014/4/18 ① button与submit的区别 ②现象 : 数据库中其他值可以取到 有的却取不到 解决 看获取时“#”有无
①<input type="button" /> 这就是一个按钮.如果你不写javascript 的话,按下去什么也不会 发生. <input type=&quo ...
- input的button和submit的区别
故事由来: 其实这个问题,昨天已经遇到过,但是昨天是公司的一枚老员工帮助我这个实习生调的,而且我也确(猜)定(测)那枚老员工也不知道这个区别.然后今天又遇到相同问题. 故事梗概: 现在公司里面做一个项 ...
- 表单提交:button input submit 的区别
http://harttle.com/2015/08/03/form-submit.html 最近项目代码中的表单提交的方式已经百花齐放了,现在用这篇文章来整理一下不同表单提交方式的区别,给出最佳实践 ...
- [转]表单提交:button input submit 的区别
博客转自于 http://harttle.com/2015/08/03/form-submit.html ,同时自己做了稍微改动 最近项目代码中的表单提交的方式已经百花齐放了,现在用这篇文章来整 ...
- 表单提交中的input、button、submit的区别
1.input[type=submit] 我们直接来看例子: 代码如下: <form> <input name="name"> <input type ...
- form表单重复提交,type=“button”和type=“submit”区别
公司测试提了一个项目后台在IE浏览器下(360,firefox就没问题)出现数据重复的问题,调试了好久终于发现问题所在,也不知道是谁写的代码,醉醉的.... 错误地点: <input type= ...
随机推荐
- SQL Server中获取指定时间段内的所有日期
DECLARE @days INT, @date_start DATETIME = '2016-11-01', @date_end DATETIME = '2016-11-10' SET @days ...
- linux 定制
转载至http://luyafei.blog.51cto.com/1092421/1131532 测试环境: VMware Workstation 8.0 CentOS 6.7 x86_64 1.安装 ...
- Wet Shark and Bishops(思维)
Today, Wet Shark is given n bishops on a 1000 by 1000 grid. Both rows and columns of the grid are nu ...
- 设计一个MQ的考虑点
转自: https://segmentfault.com/a/1190000004461970 序 这里总结下MQ的研究点,以及如果要自己设计一个MQ应该考虑的因素. 考虑点 1.远程通信功能 (1) ...
- Buy or Build UVA - 1151 Kruskal+枚举
题意: 大概意思是有 n 个点,现在有 q 个方案 ,第 i 个方案耗费为 ci ,使 Ni 个点联通 ,当然也可以直接使两点联通 ,现求最小生成树的代价. 两点直接联通的代价是欧几里得距离的平方: ...
- Ubuntu 16.04设置root用户登录图形界面
ubuntu桌面版默认不开启root登录,所以需要进行设置, 可以参考博客 https://www.linuxidc.com/Linux/2017-01/139094.htm
- Python文件操作,异常语法
1.文件 2.异常 1.文件的输入输出 #1.打开文件 open 函数open(file,[option])#file 是要打开的文件#option是可选择的参数,常见有 mode 等#2.文件的打 ...
- CentOS快速搭建FTP(初级-四步)
部署FTP,如果之前没有搭建过,刚开始找资料的时候网上各种各样的复杂参数配置,看的头晕,这里就把最核心的部分展示出来. 1.安装 vsftpd yum install -y vsftpd 2.如果是默 ...
- newFixedThreadPool固定线程使用
1.newFixedThreadPool固定线程池, 使用完毕必须手动关闭线程池, 否则会一直在内存中存在, package ThreadTest; import java.util.concurr ...
- Tomcat-猫
第1章 Tomcat简介 Tomcat 是一个web服务器 ,类似nginx,apache的http Nginx http 只能处理html等静态文件jpg() 网页分为静态网页(以.html 或 ...