servlet html js提交表单,使用jquery.form.js实现form表单无刷新提交简单示例
直到今天,才发现JQuery原来有个Form表单插件,而且还是无刷新页面提交表单,看来自己还要多加强学习啊!不多说了,直接贴代码吧,代码比较简单!
Servlet代码:
package com.project.servlet;
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class AjaxFormServlet extends HttpServlet {
public AjaxFormServlet() {super();}
public void destroy() {super.destroy();}
public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doPost(request, response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//String param = request.getParameter("txt");
String param1 = request.getParameter("txt1");
String param2 = request.getParameter("txt2");
System.err.println("参数1的值:param1="+param1+",参数2的值:param2="+param2);
response.setContentType("applicationContext/JSON,encoding=utf-8");
response.getWriter().write("{\"msg\":\"Hello Wold\"}");
}
public void init() throws ServletException {}
}
页面代码:
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
">
首页
$(document).ready(function(){
var options = {
type:"POST",//请求方式:get或post
dataType:"json",//数据返回类型:xml、json、script
beforeSerialize:function(){
//alert("表单数据序列化前执行的操作!");
//$("#txt2").val("java");//如:改变元素的值
},
//data:{'txt':"JQuery"},//自定义提交的数据
beforeSubmit:function(){
//alert("表单提交前执行的操作!");
//if($("#txt1").val()==""){return false;}//如:验证表单数据是否为空
},
success:function(json){//表单提交成功回调函数
alert("表单操作完成!操作结果:"+json.msg);
},
error:function(err){
alert("表单提交异常!"+err.msg);
}
};
$("#form").ajaxForm(options);
});
好了,到此结束,是不是很Easy!
注:在操作时遇到一个很诡异的情况,就是由于我的浏览器问题,后台总是无法接收到参数,其他人访问正常,所以请采用两种浏览器多试试,以免遇到类似的问题,花费自己不必要的时间!
servlet html js提交表单,使用jquery.form.js实现form表单无刷新提交简单示例相关推荐
- Ajax提交json数据,通过jquery.cookie.js插件解决csrf_token问题
html代码和js代码 <!doctype html> <html lang="en"> <head><meta charset=&quo ...
- php mysql刷新表格_php读入mysql数据并以表格形式显示(表单实现无刷新提交)
在网上参考了些例子,于是我这个sample实现了如标题上的功能.话不多说,上代码: lishi.html 搜索 form#form1 { height: 93%; } p { width: 99%; ...
- 使用jquery.form.js实现form表单无刷新提交简单示例
2019独角兽企业重金招聘Python工程师标准>>> 直到今天,才发现JQuery原来有个Form表单插件,而且还是无刷新页面提交表单,看来自己还要多加强学习啊!不多说了,直接贴代 ...
- jQuery表单校验jquery.validate.js的使用
jQuery是一个快速.简洁的js库,为网站的快速开发简化了HTML文档遍历,事件处理,动画,以及Ajax交互.使用jQuery将极大的提高编写javascript代码的效率, 让写出来的代码更加优雅 ...
- android webview js 失效,Android WebView注入JQuery、JS脚本及执行无效的问题解决
在项目中遇到JQuery注入后,执行无效的问题. 我们知道必须在网页加载完成后,也就是在onPageFinished()方法被调用后才能执行被注入的JS. 但是在有些手机上并不能成功执行,我的解决方案 ...
- js实现中英文切换(jquery.i18n.js)
jquery.i18n.js 实现中英文切换 方法 由于在公司官网所用到中英文切换功能,代码时js.jq写的.个人简单记录一下过程: 用的方法是 jquery.i18n.js. jquery.i18n ...
- jQuery AJAX 网页无刷新上传示例
新年礼,提供简单.易套用的 jQuery AJAX 上传示例及代码下载.后台对文件的上传及检查,以 C#/.NET Handler 处理 (可视需要改写成 Java 或 PHP). 有时做一个网站项目 ...
- Jquery Ajax自定义无刷新提交表单Form
Jquery的$.ajax方法可以实现ajax调用,要设置url,post,参数等. 如果要提交现有Form需要写很多代码,何不直接将Form的提交直接转移到ajax中呢. 以前的处理方法 如Form ...
- 无刷新提交表单(非Ajax实现)
HTML代码: <iframeid="fra"name="frm"style="display: none;"></ifr ...
最新文章
- 动态规划(浅层基础)
- Oracle性能调整的误区
- Spark优化一则 - 减少Shuffle
- python颜值分析
- 肇庆计算机商务学校地址,肇庆市商业学校(商业技工学校)招生报名
- 实用Redis操作类
- use IE7 agent on safari 13
- 计算机c盘装什么,电脑只有一个C盘!怎么为电脑重装系统?
- ITellYou结合软碟通安装Win10系统指南
- 友善之臂mini2440使用日志1
- 题解 CF722E 【Research Rover】
- BIOS设置中功能的翻译及介绍
- 短视频系统源码,android 真正的全屏沉浸式体验
- 转-思维要裂变要敢闯想
- CG Tools 工具收集
- ORA-01400: cannot insert NULL into | 通过SQL链接服务器 往Oracle库的表中 插入默认值问题
- dataframe处理excel基础内容
- 不懂带人,你就自己干到死
- BC26 TCP透传
- 成功的 Git 分支模型
热门文章
- python 获取硬盘信息_使用python获取电脑的磁盘信息方法
- 如何将一个完整项目推到码云_怎么将本地项目放到码云(gitee)上面?图文详解
- perl删除文件_Perl小知识语法重点和数据类型
- mac php fpm 自动启动,mac系统,php-fpm加入开机启动项
- firefox linux脚本启动,在Linux终端中使用后台运行模式启动程序的方法
- Python Imaging Library: ImageChops Module(图像通道操作模块)
- python使用opencv保存视频_Pythone OpenCV学习笔记之:视频文件读取与保存
- vagrant特性——基于docker开发环境(docker和vagrant的结合)-2-命令
- PHP-FPM,Nginx,FastCGI 之间的关系
- Android中的WebView之loadDataWithBaseURL()与loadData()