一般的form提交操作写法为

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

点击submit按钮或直接回车可以将数据提交到saveReport页面,但是提交后也会跳转到saveReport页面

如何做到 
将数据提交到saveReport(form的action指向)页面,但是页面又不进行跳转,即保持当前页面不变呢?? 
这种需要在load一个页面的时候尤其迫切。

利用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,否则表单会自己再做一次提交操作,并且页面跳转 

form表单只提交数据而不进行页面跳转的解决方案的更多相关文章

  1. Jquery构建Form表单Post提交数据的简单方法

    $.extend({ PostSubmitForm: function (url, args) { var body = $(document.body), form = $("<fo ...

  2. form表单action提交表单,页面不跳转且表单数据含文件的处理方法

    在最近的项目中需要将含 input[type='file']的表单提交给后台 ,并且后台需要将文件存储在数据库中.之前所用的方法都是先将文件上传到七牛服务器上,然后七牛会返回文件的下载地址,在提交表单 ...

  3. 使用ajax方法实现form表单的提交(附源码)

    写在前面的话 在使用form表单的时候,一旦点击提交触发submit事件,一般会使得页面跳转,页面间的跳转等行为的控制权往往在后端,后端会控制页面的跳转及数据传递,但是在某些时候不希望页面跳转,或者说 ...

  4. 使用ajax方法实现form表单的提交

    作者:13 GitHub:https://github.com/ZHENFENG13 版权声明:本文为原创文章,未经允许不得转载. 写在前面的话 在使用form表单的时候,一旦点击提交触发submit ...

  5. JavaWeb学习总结(十一):Session解决form表单重复提交

    在平时开发中,如果网速比较慢的情况下,用户提交表单后,发现服务器半天都没有响应,那么用户可能会以为是自己没有提交表单,就会再点击提交按钮重复提交表单,我们在开发中必须防止表单重复提交. 一.表单重复提 ...

  6. 微信自带浏览器不支持form表单post提交方案解决

      微信自带浏览器form表单post提交,Java控制后台获取不到值得解决方案: 第一种:把post改成get请求,但是改后另一个问题来了就是,数据不安全了,连接上都能看到,导致数据会流失,Java ...

  7. 利用 ajax自定义Form表单的提交方式

    需求场景:有时候单纯的form表单无法向后端传递额外的参数 比如需要action传递js异步生成的参数 ,form表单默认的action就无法满足需求,这时就需要我们自定义form表单的提交方式. h ...

  8. form表单ajax提交

    这里下面有两种  第一种是form表单里面添加了数据,并且含有上传的图片,第二种是from表单中不含有图片  只有普通数据 第一种form表单中包含有图片的类型: <form method=&q ...

  9. JavaScript 创建一个 form 表单并提交

    <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...

随机推荐

  1. sql 索引 填充因子(转)

    和索引重建最相关的是填充因子.当创建一个新索引,或重建一个存在的索引时,你可以指定一个填充因子,它是在索引创建时索引里的数据页被填充的数量.填充因子设置为100意味着每个索引页100%填满,50%意味 ...

  2. 【转】【Asp.Net】Asp.net发送邮件的两种方法小结

    这几天看了一下Asp.net发送邮件方面的东西,记得之前的IIS6上有SMTP服务器,可以直接利用这个进行邮件发送,现在的开发环境是Windows 7,找了半天没有找到,到网络上查了才知道原来wind ...

  3. ls -F一种非常有用的ls格式

    ls -F一种非常有用的ls格式  tz/y/yupeng > ls -F#q#           News/         doc/          images/       mbox ...

  4. Oracle11G 7个服务说明

    中的方法成功安装Oracle 11g后,共有7个服务, 这七个服务的含义分别为: 1. Oracle ORCL VSS Writer Service: Oracle卷映射拷贝写入服务,VSS(Volu ...

  5. 如何拿到半数面试公司Offer——我的Python求职之路(转)

    原文出处:http://www.cnblogs.com/Lands-ljk/p/5836492.html 从八月底开始找工作,短短的一星期多一些,面试了9家公司,拿到5份Offer,可能是因为我所面试 ...

  6. Asp.net通过Jquery操作WebService进行Ajax读写

    一说到开始,我们当然需要项目. 首先,创建一个Asp.net Web 应用,然后新增一个名称为“Web 服务”的文件,也就是后缀名为".asmx"的文件,然后需要进行配置一下,在W ...

  7. 第一周Web类WriteUp

    Forms 看到这题目第一反应就是先抓个包试试,抓包之后效果如图所示 看到一个showsource=0,那就想着把它改成1看看会出现什么效果,改成1之后forward,发现网页上变成了这个样子 根据这 ...

  8. Jenkins进阶系列之——16一个完整的JENKINS下的ANT BUILD.XML文件

    网上看见的,确实很全,该有的基本都覆盖到了.自己拿来稍微改改就可以用了. 注:property中的value是你自己的一些本地变量.需要改成自己的 <?xml version="1.0 ...

  9. MVC5 + EF6 + Bootstrap3 (9) HtmlHelper用法大全(下)

    文章来源:Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc5-ef6-bs3-get-started-httphelper-part2.html 上一节 ...

  10. IT男的”幸福”生活"系列暂停更新通知

    首先谢谢博客园,这里给了我很多快乐.更给了大家一个学习的好地方. 在这几天更新过程中,看到了很多哥们的关注,在这里我谢谢你们,是你们给了我动力,是你们又一次给了我不一样的幸福. 在续5中我已回复了,博 ...