AJAX

作者: 全满 | 来源:发表于2017-12-05 21:00 被阅读0次

使用AJAX接收后端发出的数据

2017-12-05 20-17-48 的屏幕截图.png

前端页面写的内容

//使用ajax输出从后台获取的信息
<script type="text/javascript">
    $(document).ready(function () {
        $.post("/UserServlet?method=username",
            function (data) {
                console.log(data[0].u_userid)

                //获取input框id,通过id输出内容

                // $("#username1").val(data[0].u_userid);
                // $("#username2").val(data[0].u_username);

                //通过获取input框的name,输出内容

                $("input[name='u_userid']").val(data[0]['u_userid']);
                $("input[name='u_username']").val(data[0]['u_username']);
                $("input[name='u_password']").val(data[0]['u_password']);
                $("input[name='u_sex']").val(data[0]['u_sex']);
                // $("input[name='u_class']").val(data[0]['u_class']);
            },"json"
        );
    });
</script>
  • input框的内容
账号:<input type="text" name="u_userid" id="username1" val="" />
姓名:<input type="text" name="u_username" id="username2" val="" />
...

servlet代码

2017-12-05 20-39-12 的屏幕截图.png
protected void username(HttpServletRequest request,
                 HttpServletResponse response) throws ServletException, IOException {
        /*UserBean userBean = new UserBean();*/
        List list = (List) request.getSession().getAttribute("info");
        UserBean userBean = (UserBean) list.get(0);
        int u_id = userBean.getU_id();

        UserBean userBean1 = userService.username(u_id);
        System.out.println(userBean1);
        JSONArray jsonArray = JSONArray.fromObject(userBean1);
        response.getWriter().print(jsonArray);
    }
  • service
    UserService userService = new UserServiceImpl();
    UserBean username(int u_id);
  • serviceImpl
    UserDao userDao =new UserDaoImpl();
    @Override
    public UserBean username(int u_id) {
    return userDao.username(u_id);
    }
  • dao
    UserBean username(int u_id);
  • daoImpl


    2017-12-05 20-47-02 的屏幕截图.png
   public UserBean username(int u_id){
       //在数据库中查询信息
       try{
           UserBean userBean = new UserBean();
           Connection conn = ConnUtil.getConnextion();
           String changeSql = "select * from user WHERE u_id = ?";
           PreparedStatement pstm = conn.prepareStatement(changeSql);
           pstm.setInt(1, u_id);
           ResultSet rs = pstm.executeQuery();
           if(rs.next()) {
              userBean.setU_userid(rs.getString(2));
              userBean.setU_username(rs.getString(3));
              userBean.setU_password(rs.getString(4));
              userBean.setU_sex(rs.getString(5));
              userBean.setU_img(rs.getString(6));
               return userBean;
           }
       }catch (Exception e){
           System.out.println(e);
       }
       return null;
   }

使用session接收后端发出的数据

登录成功后数据库的信息就就已经存在了session中,只需要在前端显示页面,即引入js接收即可:
如下所示:

    <%
        List list = (List) request.getSession().getAttribute("info");
        UserBean userBean = (UserBean) list.get(0);
    %>
.
.
.
用户名:<input type="text" value="<%=userBean.getU_userid()%>"

相关文章

  • AJAX

    主要内容: ajax 是什么、原生ajax 写法和jQuery ajax写法。 AJAX 是什么 ajax,即As...

  • JavaScript进阶知识点--AJAX及JSON

    AJAX 关于 AJAX 什么是 AJAX AJAX 的全称是 Asynchronous JavaScript a...

  • HTML5权威指南 | 第五部分 高级功能

    三十二、使用AJAX(上) Ajax起步: 使用Ajax事件: Ajax请求的错误处理: 中止Ajax请求: 三十...

  • ajax学习笔记

    Ajax学习笔记 Ajax简介 1. Ajax是什么? Ajax : Asynochronous javascri...

  • AJAX

    一、简介 AJAX菜鸟教程 什么是 AJAX ? AJAX = 异步 JavaScript 和 XML。 AJAX...

  • js之AJAX复习

    异步交互和同步交互 什么是Ajax? Ajax的工作原理。 Ajax包含的技术: Ajax的缺陷: Ajax的核心...

  • 复习jQuery - ajax

    jQuery ajax - ajax() 方法 $.ajax({ url:'oo.php', ...

  • jQuery中Ajax请求的使用和四个步骤示例

    ajax() 方法用于执行 AJAX(异步 HTTP)请求,所有的 jQuery AJAX 方法都使用 ajax(...

  • ajax

    1、什么是ajax? 2、ajax的原理 3、ajax的核心对象 4、ajax的优点: ajax的缺点: 被jqu...

  • ajax

    Ajax 1 - 请求纯文本 Ajax 2 - 请求JSON数据 Ajax 3 - 请求Github接口 Ajax...

网友评论

      本文标题:AJAX

      本文链接:https://www.haomeiwen.com/subject/ozfhixtx.html