当前位置: 首页 > news >正文

Form表单只提交数据而不进行页面跳转的方法

解决方案:将数据提交到saveReport(form的action指向)页面,但是页面又不进行跳转,即保持当前页面不变呢?利用jquery的ajaxSubmit函数以及form的onsubmit函数完成

一般的写法为:

<form action="saveReport.htm" method="post"> 
…… 
<input type="submit" value="保存报告"/> 
</form> 

点击submit按钮或直接回车可以将数据提交到saveReport页面,但是提交后也会跳转到saveReport页面 ,如何做到
将数据提交到saveReport(form的action指向)页面,但是页面又不进行跳转,即保持当前页面不变呢??

利用jquery的ajaxSubmit函数以及form的onsubmit函数完成,如下:

<form id="saveReportForm" action="saveReport.htm" method="post" onsubmit="return saveReport();"> 
    <input type="submit" value="保存报告"/> 
</form> 

form增加一个id用于在jquery中调用,增加一个onsubmit函数用于submit前自己提交表单
saveReport对应函数为:

function saveReport() { 
// jquery 表单提交 
$("#showDataForm").ajaxSubmit(function(message) { 
// 对于表单提交成功后处理,message为提交页面saveReport.htm的返回内容 
}); 
return false; // 必须返回false,否则表单会自己再做一次提交操作,并且页面跳转 
}

相关文章:

  • ajaxForm与ajaxSubmit的区别
  • rem是如何实现自适应布局的
  • 如何实现图片的异步加载
  • AMD和CMD的区别
  • 使用Cesium.js加载3D模型
  • js中for in与for of之间的差异
  • Cesium实现三维可视化一般步骤
  • Vue2.0 探索之路——生命周期和钩子函数的一些理解
  • vuejs实践todolist列表
  • vue中的watch监听事件机制
  • CommonJS、AMD、CMD的区别
  • npm局部安装和全局安装文件的区别
  • querySelector操作dom的用法
  • webpack打包文件出错
  • npm中的--save-dev与--save的区别
  • Consul Config 使用Git做版本控制的实现
  • C学习-枚举(九)
  • dva中组件的懒加载
  • ES6 学习笔记(一)let,const和解构赋值
  • Go 语言编译器的 //go: 详解
  • java8-模拟hadoop
  • JAVA多线程机制解析-volatilesynchronized
  • mockjs让前端开发独立于后端
  • MYSQL 的 IF 函数
  • Octave 入门
  • socket.io+express实现聊天室的思考(三)
  • Sublime Text 2/3 绑定Eclipse快捷键
  • Vue2 SSR 的优化之旅
  • WordPress 获取当前文章下的所有附件/获取指定ID文章的附件(图片、文件、视频)...
  • 开源SQL-on-Hadoop系统一览
  • 力扣(LeetCode)21
  • 探索 JS 中的模块化
  • 【云吞铺子】性能抖动剖析(二)
  • 微龛半导体获数千万Pre-A轮融资,投资方为国中创投 ...
  • ​插件化DPI在商用WIFI中的价值
  • ​软考-高级-系统架构设计师教程(清华第2版)【第20章 系统架构设计师论文写作要点(P717~728)-思维导图】​
  • (¥1011)-(一千零一拾一元整)输出
  • (2021|NIPS,扩散,无条件分数估计,条件分数估计)无分类器引导扩散
  • (C#)获取字符编码的类
  • (安全基本功)磁盘MBR,分区表,活动分区,引导扇区。。。详解与区别
  • (三)uboot源码分析
  • (十)T检验-第一部分
  • (四)TensorRT | 基于 GPU 端的 Python 推理
  • (心得)获取一个数二进制序列中所有的偶数位和奇数位, 分别输出二进制序列。
  • (原創) 博客園正式支援VHDL語法著色功能 (SOC) (VHDL)
  • (转)3D模板阴影原理
  • .form文件_一篇文章学会文件上传
  • .NET C#版本和.NET版本以及VS版本的对应关系
  • .NET MVC之AOP
  • .NET 事件模型教程(二)
  • .net/c# memcached 获取所有缓存键(keys)
  • .NET/C# 阻止屏幕关闭,阻止系统进入睡眠状态
  • .NET开源全面方便的第三方登录组件集合 - MrHuo.OAuth
  • .NET框架设计—常被忽视的C#设计技巧
  • .NET连接数据库方式