form表单submit按钮提交页面不跳转
方案一
<html>
<body> <form action="" method="post" target="nm_iframe">
<input type="text" id="id_input_text" name="nm_input_text" />
<input type="submit" id="id_submit" name="nm_submit" value="提交" />
</form> <iframe id="id_iframe" name="nm_iframe" style="display:none;"></iframe> </body>
</html>
方案二
<html>
<body> <form action="/api/user/register" method="post" id="registSubmit" >
<input type="text" id="id_input_text" name="nm_input_text" />
<input type="submit" id="id_submit" name="nm_submit" value="提交" />
</form>
</body>
</html>
$('#registSubmit').on('submit', function(){
registPost()
event.preventDefault() //阻止form表单默认提交
})
function registPost () {
$.ajax({
type: "post",
url: "/api/user/register",
data: $('#registSubmit').serialize(),
}).success(function(message) {
console.log(message)
}).fail(function(err){
console.log(err)
})
/*
或者用jquery.form.min.js提交
$('#registSubmit').ajaxSubmit(function(message){
console.log(message);
})
*/
}
form表单submit按钮提交页面不跳转的更多相关文章
- 防止表单提交时刷新页面-阻止form表单的默认提交行为
最近在写 ajax 提交的时候遇到一个问题,在执行 ajax 提交之后,浏览器页面自动刷新了,主要是没有 由于form 表单的默认提交行为.一下是几种阻止 form 表单默认提交行为的方式. 1.使用 ...
- form表单submit事件
form表单submit事件同时会触发form表单中button按钮的click事件 <!DOCTYPE html> <html> <head> <meta ...
- Form表单三种提交按钮的区别?
1.<input type='button' id='btn' onclick='check()' value="提交"> 说明:只是普通的按钮(不附带提交功能),不会 ...
- form表单取消按钮自动提交
默认写在form表单里的按钮可以自动提交表单,现在要实现的效果是点击button按钮调用js函数,再有ajax提交 <button type="button" class=& ...
- 提交Form表单,submit之前做js判断处理
效果: 在点击提交按钮时,首先进行js判断, 如果不符合条件,则alert出提示信息,并return false. 主要点就在于给form表单添加一个onsubmit事件. 在onsubmit事件中定 ...
- 基于form表单submit提交不跳转
方法一:target <html> <body> <form action="" method="post" target=&qu ...
- form表单input回车提交问题
问题:文本框输入完成后点击回车页面刷新问题出在form上,当表单中只有一个文本框的时候获取焦点并点击回车之后会提交表单内容,就会发生刷新事件. 解决方法: 1.增加一个隐藏的输入框 <input ...
- 通过button将form表单的数据提交到action层
form表单中不需要写action的路径,需要给form表单一个唯一的id,将你要提交的信息的表单中的标签name="action中的javabean对象.javabean属性". ...
- form 表单跨域提交
<!DOCTYPE html><html> <head> <title>form 表单上传文件</title> <script src ...
随机推荐
- JQuery 的跨域方法 可跨任意网站
JS的跨域问题,很多人在网上找其解决方法,教其用IFRAME去解决的文章很多,真有那么复杂吗?其实很简单的,如果你用JQUERY,一个GETJSON方法就搞定了,而且是一行代码搞定. 下面开始贴出方法 ...
- 网页设计和制作,数学,access 2010
网页设计和制作 插入特殊字符:插入---字符---其他字符---选择字符---完成. 插入水平线:插入---字符---水平线---右键---选择第二个框---改变颜色---完成. 插入项目类表:选择要 ...
- Oracle数据库触发器使用(删除触发)
当我们需要用到触发器的时候,还是很方便,你会指定当我在操作某一事件时触发效果完成我所希望完成的事情:这就是触发器, 下面我给大家上一串代码,这是一个当我在操作删除事件操作时候,我希望把即将删除那条数据 ...
- hibernate课程 初探一对多映射1-1 课程简介
hibernate 常见映射类型 one-to-many many-to-one one-to-one many-to-many
- 在CentOS上配置MySQL服务
#!/bin/sh # Copyright Abandoned 1996 TCX DataKonsult AB & Monty Program KB & Detron HB # Thi ...
- iDempiere 使用指南 BOM及工单流程
Created by 蓝色布鲁斯,QQ32876341,blog http://www.cnblogs.com/zzyan/ iDempiere官方中文wiki主页 http://wiki.idemp ...
- 转:ACCESS数据库转ORACLE数据库分享
来源: 作者:zz 网上有很多文章介绍access转oracle数据库的方法,本人都尝试了,不是很成功,列举一下,后来人不必盲目试了,基本不成功: 1.Access-->excel-->P ...
- python-daemon
http://legacy.python.org/dev/peps/pep-3143/#python-daemon install yum install python-daemon example ...
- git 因线上分支名重复导致无法拉取代码
有时 git pull 或 git fetch 时发现 git 报了个异常,说法像是无法将线上某个分支与本地分支合并,由于分支是...(很长的hash)但是分支却是...(很长的hash) 仔细查查后 ...
- 使用 javascript API -- fetch 实现文件下载功能
下载原理 下载原理很简单,就是模拟 a 标签的点击下载,我们都知道 ajax 不支持下载文件功能,是因为 ajax 只能用来传输字符型数据,所以在过去无法使用 ajax 来下载文件. xhr2 可以把 ...