struts2、ajax实现前后端交互
跳过struts2环境搭建部分,或者可以看我的博客(http://www.cnblogs.com/zhangky/p/8436472.html),里面有写,很详细。
需要导入的jar包(struts官网有,自己下)

一、java类
private String username;
private String pwd;
private Map<String, Object> result; public String getUsername() {
return username;
} public void setUsername(String username) {
this.username = username;
} public String getPwd() {
return pwd;
} public void setPwd(String pwd) {
this.pwd = pwd;
} public Map<String, Object> getResult() {
return result;
} public void setResult(Map<String, Object> result) {
this.result = result;
} public String login() {
result = new HashMap<String , Object>();
if(username.equals("z") && pwd.equals("123")) {
result.put("success", true);
result.put("username", username);
return "success";
}else {
result.put("success", false);
return "success";
} }
二、html页面
<html>
<head>
<meta charset="UTF-8">
<title>登录</title>
</head>
<body>
<div id="tips"></div>
<input type="text" id="username"/>
<input type="password" id="pwd"/>
<button onclick="login()">登录</button>
</body>
<script src="jquery.min.js"></script>
<script>
function login(){
const username = document.getElementById("username").value;
const pwd = document.getElementById("pwd").value;
$.ajax({
type:"POST",
url:"login",
data:{
"username":username,
"pwd":pwd
},
dataType:"json",
success:function(data){
let tips = document.getElementById("tips");
if(data.success == true){
window.location.href = "welcome.html?username=" + data.username
}else{
tips.innerHTML = "用户名或者密码错误";
}
},
error:function(error){ }
})
}
</script>
</html>
三、struts.xml
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.3//EN"
"http://struts.apache.org/dtds/struts-2.3.dtd"> <struts>
<package name="default" namespace="/" extends="json-default,struts-default">
<action name="login" class="day20.LoginAction" method="login" >
<!--result默认name是success可不写,由于返回的是json格式数据,因此type必须是json -->
<result type="json">
<!--param 的 name固定写,result就是java类要返回的数据变量 -->
<param name="root">result</param>
</result>
</action>
</package>
</struts>
struts2、ajax实现前后端交互的更多相关文章
- 把数据转化为JSON格式用ajax进行前后端交互
接着在https://www.cnblogs.com/dong973711/p/10907733.html的基础上做验证. 从前端提交数据 前端页面,submit.html <!DOCTYPE ...
- SSM-网站后台管理系统制作(4)---Ajax前后端交互
前提:Ajax本身就为前后端交互服务的,实现功能:用户输入信息,实时判断用户的情况,这也是现在登录界面普遍流行的做法.前端js通过注释识别Controller层,该层查询返回,和之前Google验证码 ...
- thinkphp+jquery+ajax前后端交互注册验证
thinkphp+jquery+ajax前后端交互注册验证,界面如下 register.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1. ...
- ajax学习----json,前后端交互,ajax
json <script> var obj = {"name": "xiaopo","age": 18,"gender ...
- Vue-CLI项目-axios模块前后端交互(类似ajax提交)
08.31自我总结 Vue-CLI项目-axios前后端交互 一.模块的安装 npm install axios --save #--save可以不用写 二.配置main.js import axio ...
- content-type常见类型辨析(以ajax与springmvc前后端交互为例)
博客搬家: content-type常见类型辨析(以ajax与springmvc前后端交互为例) 在http报文的首部中,有一个字段Content-type,表示请求体(entity body)中的数 ...
- Node之简单的前后端交互
node是前端必学的一门技能,我们都知道node是用的js做后端,在学习node之前我们有必要明白node是如何实现前后端交互的. 这里写了一个简单的通过原生ajax与node实现的一个交互,刚刚学n ...
- Django之META与前后端交互
Django之META与前后端交互 1 提交表单之GET 前端提交数据与发送 1)提交表单数据 2)提交JSON数据 后端的数据接收与响应 1)接收GET请求数据 2)接收POST请求数据 3)响应请 ...
- 前后端交互实现(nginx,json,以及datatable的问题相关)
1.同源问题解决 首先,在同一个域下搭建网络域名访问,需要nginx软件,下载之后修改部分配置 然后再终端下cmd nginx.exe命令,或者打开nginx.exe文件,会运行nginx一闪而过, ...
随机推荐
- postgresql-递增uuid优点
递增uuid的优点: https://blog.2ndquadrant.com/on-the-impact-of-full-page-writes/ 减小wal生成
- POJ 2704
#include <iostream> #include <string> #define LL long long #define MAXN 100 using namesp ...
- CentOS 6(64-bit) + Nginx搭建静态文件服务器
Nginx搭建静态文件服务器 使用命令打开Nginx配置文件: sudo vim /etc/nginx/conf.d/default.conf 将配置改为: server { ...... ..... ...
- Git使用(1)
安装git完成后 1.首先配置你的用户信息,用于体现在你的提交记录中包含your name and your email git config --global user.name "you ...
- Python:高效计算大文件中的最长行的长度
在操作某个很多进程都要频繁用到的大文件的时候,应该尽早释放文件资源(f.close()) 前2种方法主要用到了列表解析,性能稍差,而最后一种使用的时候生成器表达式,相比列表解析,更省内存 列表解析和生 ...
- Identity Server4学习系列三
1.简介 在Identity Server4学习系列一和Identity Server4学习系列二之令牌(Token)的概念的基础上,了解了Identity Server4的由来,以及令牌的相关知识, ...
- Asp.Net Core 集成 Hangfire 配置使用 Redis 存储
Hangfire 官方支持 MSSQL 与 Redis(Hangfire.Pro.Redis) 两种 ,由于我的数据库是 MYSQL ,粗略查询了一下文档,现在对 .NET Core 支持的并不够好, ...
- 业余实现一个统计A股数据工具
自己瞎捣鼓了几天 python,数据来源新浪财经,每天收盘启动爬虫抓取一遍,web 端呈现日线与周线数据:实时图表显示上证指数与个股指数等.技术点:scrapy apscheduler sqlalch ...
- MVC源码分析 - ModelBinder绑定 / 自定义数据绑定
这几天老感觉不对, 总觉得少点什么, 今天才发现, 前面 3 里面, 在获取Action参数信息的时候, 少解析了. 里面还有一个比较重要的东西. 今天看也是一样的. 在 InvokeAction( ...
- sqoop部署及使用
一.概述 sqoop是hive.hdfs.hbase等与RDMBS(mysql等)之间的沟通桥梁,主要通过JDBC与RDMBS进行交互.有两个版本sqoop1和sqoop2,sqoop1架构简单,使用 ...