1.前台html页面。有一段代码如下:

账  户: 
 <input type="text" name="userName" id="userN" placeholder="请输入账户名">
 <br />
 <br />
 <br /> 密&nbsp;&nbsp;码:&nbsp;
 <input type="text" name="passwd" id="userP" placeholder="请输入密码">
 <br />
 <input type="button" value="登录" id="userB">

----------

在页面引入jquery库(具体可以去网上查)下边是一段js代码:

<script type="text/javascript">
 $(document).ready(function() {
  $("#userB").click(function() {
   var name = $("#userN").val();
   var pawd = $("#userP").val();
   jQuery.ajax({
    type : 'POST',
    dataType : 'json',//提交方式是json,也可以是html和text

//dataType:'json' 的意思是URL返回值是以JSON的格式传过来的,然后在页面上解析时就要采取JSON格式来展示。

url : 'servlet/UserInfoAction',//提交到servlet中
    cache : false,
    data : {
     name : name,
     pawd : pawd,
    },
    success : function(data, textStatus) {
     //  请求成功时处理
     alert(data[0].name);//用这种写法能取出后台传回来的json对象的属性

if (data[0]!=null) {
      alert("登录成功!");
       var url = getRootPath()+ "/welcome.html";//获取工程路径 
//       var url = getRootPath() + "/servlet/showMessAction";
      location.href = url;
     }
    },
    error : function() {
     alert("账户密码错误!");
    }
    
   });
  });
 });

//这是一段获取项目路径的js方法

//js获取项目根路径,如:http://localhost:8099/UniqueduHome 
 function getRootPath() {
  //获取当前网址,如: http://localhost:8099/UniqueduHome/view/error/notAuthorize.jsp 
  var curWwwPath = window.document.location.href;
  //获取主机地址之后的目录,如: UniqueduHome/view/error/notAuthorize.jsp 
  var pathName = window.document.location.pathname;
  var pos = curWwwPath.indexOf(pathName);
  //获取主机地址,如: http://localhost:8099 
  var localhostPaht = curWwwPath.substring(0, pos);
  //获取带"/"的项目名,如:/UniqueduHome 
  var projectName = pathName.substring(0,
    pathName.substr(1).indexOf('/') + 1);
  return (localhostPaht + projectName);
 }

</script>

2.java后台

String username =request.getParameter("name");
  String password =request.getParameter("pawd");

//自己写的方法,返回一个实体对象

UserInfo userInfo = userInfoService.getUser(username, password);

if (null != userInfo) {
   //向前台输出数据用response.getWriter().print()这种写法

//JSONArray.fromObject(userInfo);转为json数组格式

//也可以返回一个字符串,页面是判断data跟返回的字符串是否相等做逻辑处理

response.getWriter().print(JSONArray.fromObject(userInfo));

} else {
   response.setCharacterEncoding("UTF-8");
   response.setHeader("content-type", "text/html;charset=UTF-8");
   response.getWriter().println("<font color='red'>账户名/密码错误</font>");
   return;
  }
 }

ajax提交数据到java后台,并且返回json格式数据前台接收处理值的更多相关文章

  1. ajax请求后台,返回json格式数据,模板!

    添加一个用户的时候,需要找出公司下所有的部门,和相应部门下的角色,利用ajax请求,实现联动技术.将返回的json格式数据,添加到select标签下. <script type="te ...

  2. 使用jQuery发送POST,Ajax请求返回JSON格式数据

    问题: 使用jQuery POST提交数据到PHP文件, PHP返回的json_encode后的数组数据,但jQuery接收到的数据不能解析为JSON对象,而是字符串{"code" ...

  3. Spring MVC 学习笔记11 —— 后端返回json格式数据

    Spring MVC 学习笔记11 -- 后端返回json格式数据 我们常常听说json数据,首先,什么是json数据,总结起来,有以下几点: 1. JSON的全称是"JavaScript ...

  4. WebService返回json格式数据供苹果或者安卓程序调用

    1.新建一个WebService. 2. /// <summary> /// DemoToJson 的摘要说明 /// </summary> [WebService(Names ...

  5. 返回json格式数据乱码

    本文为博主原创,未经允许不得转载: 原本返回json格式数据的代码: @ResponseBody @RequestMapping(value = "getListByTime", ...

  6. Django 1.8.11 查询数据库返回JSON格式数据

    Django 1.8.11 查询数据库返回JSON格式数据 和前端交互全部使用JSON,如何将数据库查询结果转换成JSON格式 环境 Win10 Python2.7 Django 1.8.11 返回多 ...

  7. springmvc通过ajax异步请求返回json格式数据

    jsp 首先创建index.jsp页面 <script type="text/javascript"> $(function () { $("#usernam ...

  8. 如何让webapi只返回json格式数据

    最近脑子不好用,总记不住事,以前搞过让webapi只返回json格式的数据,今天有人问我又突然想不起了,后来总结一下,备忘一下,大概有下面几种处理方式 1.在WebApiConfig类的Registe ...

  9. C#返回JSON格式数据

    又类的属性生成json格式数据 using System; using System.Collections.Generic; using System.Linq; using System.Web; ...

随机推荐

  1. Java内部类final语义实现

    本文描述在java内部类中,经常会引用外部类的变量信息.但是这些变量信息是如何传递给内部类的,在表面上并没有相应的线索.本文从字节码层描述在内部类中是如何实现这些语义的. 本地临时变量 基本类型 fi ...

  2. FunDA(2)- Streaming Data Operation:流式数据操作

    在上一集的讨论里我们介绍并实现了强类型返回结果行.使用强类型主要的目的是当我们把后端数据库SQL批次操作搬到内存里转变成数据流式按行操作时能更方便.准确.高效地选定数据字段.在上集讨论示范里我们用集合 ...

  3. [更新设计]跨平台物联网通讯框架ServerSuperIO 2.0 ,功能、BUG、细节说明,以及升级思考过程!

    注:ServerSuperIO 2.0 还没有提交到开源社区,在内部测试!!! 1. ServerSuperIO(SSIO)说明 SSIO是基于早期工业现场300波特率通讯传输应用场景发展.演化而来. ...

  4. CSS3 animation 动画

    今天看到一个很酷的logo看了下他用的是animation 动画效果,就拿来做例子 浏览器支持 Internet Explorer 10.Firefox 以及 Opera 支持 animation 属 ...

  5. 时光倒流程序设计-AlloyTicker

    熵与负熵 熵遵循熵增原理,即无序非热能与热能之间的转换具有方向性.薛定谔说过:生命本质在于负熵.熵代表的是无序,负熵就是熵的对立,而负熵表示的则是有序.汲取负熵(米饭.面包.牛奶.鸡蛋),可以简单的理 ...

  6. SVG 文本

    该部分为四个主要部分: 1.  <text>和<tspan>标签详解 2.  文本水平垂直居中问题 3.  <textpath>让文本在指定路径上排列  4 ...

  7. 联机分析处理(OLAP)到底是什么?

    联机分析处理 (OLAP) 的概念最早是由关系数据库之父E.F.Codd于1993年提出的,OLAP的提出引起了很大的反响,OLAP作为一类产品同联机事务处理 (OLTP) 明显区分开来. 当今的数据 ...

  8. Allocators与Criterion的相同点及区别

    C++98: 1.相同点: Allocators having the same type were assumed to be equal so that memory allocated by o ...

  9. eclipse调试(debug)的时候,出现Source not found,Edit Source Lookup Path,一闪而过

    问题描述 使用Eclipse调试代码的时候,打了断点,经常出现Source not found,网上找了半天,大部分提示点击Edit Source Lookup Path,添加被调试的工程,然而往往没 ...

  10. MySQL 博客文章目录(2016-08-20更新)

    1 MySQL安装配置 Linux MySQL源码安装缺少ncurses-devel包 Linux平台卸载MySQL总结 Linux 卸载mysql-libs包出现错误 2  MySQL管理配置 My ...