1：页面代码

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <link rel="stylesheet" href="http://apps.bdimg.com/libs/bootstrap/3.3.0/css/bootstrap.min.css">

</head>

<body>

<div style="width: 300px">

    <div class="form-group">

           <label for="name">名称</label>

        <input type="text" class="form-control account" name="account"   >

    </div>

    <div class="form-group">

        <label for="name">密码</label>

        <input type="password" class="form-control password" name="password"   >

    </div>

    <input type="hidden" name="__token__" value="{$Request.token}" />

    <input type="button"  id="login" value="立即登录">

</div>

</body>

</html>

<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">

</script>

<script>

    $('#login').click(function (){

        var account =$('.account').val();

        var password=$('.password').val();

        $.ajax({

            url:'/ajax/ajax/save',

            type:'POST',

            data:{

                account:account,

                password:password,

                __token__:"{$Request.token}",

            },

            dataType:'json',

            success:function (res){

                // console.log(res)

          if (res.code==200){

              alert('登录成功');

              //将用户res里的Token存入在本地

              localStorage.setItem('token','res.data.token')

              location.href='/ajax/ajax/index';

          }

            }

        })

    })

</script>

2：控制器代码

<?php

namespace app\ajax\controller;

use app\ajax\model\AjaxModel;

use think\Controller;

use think\Request;

use think\Session;

use think\View;

use tools\jwt\Token;

class Ajax extends Controller

{

    /**

     * 显示资源列表

     *

     * @return \think\Response

     */

    public function index()

    {

        //展示登录后首页

    return \view();

    }

    /**

     * 显示创建资源表单页.

     *

     * @return \think\Response

     */

    public function create()

    {

        //展示登录页面

        return view();

    }

    /**

     * 保存新建的资源

     *

     * @param \think\Request $request

     * @return \think\Response

     */

    public function save(Request $request)

    {

        //

        $params = $this->request->post();

        //验证user表是否与用户输入的信息向匹配

        $data = AjaxModel::getLogininfo($params);

        if ($params['account'] != $data['username']) {

            $this->error('账号输入错误', '/ajax/ajax/create');

        }

        if ($params['password'] != $data['userpassword']) {

            $this->error('密码输入错误', '/ajax/ajax/create');

        }

     return json(['node'=>200,'massage'=>'success','data'=>$data]);

    }

3：模型代码

<?php

namespace app\ajax\model;

use think\Model;

class AjaxModel extends Model

{

    //查询user用户表

    protected $table = 'user';

    public static function getLogininfo($params)

    {

        return self::where('username', $params['account'])->find();

    }

}

ajax 无刷新页面登录的更多相关文章

  1. 使用Ajax无刷新页面登录

    <script> window.onload = function () { var myname = document.getElementById("uname") ...

  2. Ajax 实现无刷新页面

    注意:如本文所用,在前面的文章库的数目可以在源代码中找到,我将指示在文本,其中链路,为了缩短制品的长度,阅读由此带来的不便.乞求被原谅. 评论文章 Ajax 实现无刷新页面.其原理.代码库.代码. 这 ...

  3. 使用AJAX做关键字查询：输入框变化自动搜索、无刷新页面;

    使用AJAX做关键字查询要求:1.无刷新页面2.输入框变化自动搜索 <style type="text/css"> .k{ width:150px; height:30 ...

  4. PHP + JavaScript + Ajax 实现无刷新页面加载效果

    数据源工厂 Json生成方式1 Json生成方式2 数据搬运工 数据加工师 转换类型 加工展示 结果展示 初始页面 点击按钮之后 总结 今天这个实验的思路就是实现一个无刷新的页面加载效果.具体的思路是 ...

  5. JSF中使用f:ajax标签无刷新页面改变数据

    ajax本是用在前端的一种异步请求数据的操作,广泛用于js中,一般的js框架如jq都有被封装好的方法,用于发起异步请求操作.异步操作可以增强用户体验和操作,越来越多的程序都在使用ajax.JSF的fa ...

  6. js中对arry数组的各种操作小结 瀑布流AJAX无刷新加载数据列表--当页面滚动到Id时再继续加载数据 web前端url传递值 js加密解密 HTML中让表单input等文本框为只读不可编辑的方法 js监听用户的键盘敲击事件，兼容各大主流浏览器 HTML特殊字符

    js中对arry数组的各种操作小结   最近工作比较轻松,于是就花时间从头到尾的对js进行了详细的学习和复习,在看书的过程中,发现自己平时在做项目的过程中有很多地方想得不过全面,写的不够合理,所以说啊 ...

  7. jQuery实现form表单基于ajax无刷新提交方法详解

    本文实例讲述了jQuery实现form表单基于ajax无刷新提交方法.分享给大家供大家参考,具体如下: 首先,新建Login.html页面: <!DOCTYPE html PUBLIC &quo ...

  8. Ajax无刷新提交

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. thinkphp ajax 无刷新分页效果的实现

    思路:先做出传统分页效果,然后重新复制一份Page.class.php类,对它进行修改,把js中的函数传到page类中,把上一页.下一页.首页.尾页.链接页中的url地址改成js控制的函数,模板页面中 ...

随机推荐

  1. 「BalkanOI 2018 Day1」Election

    「BalkanOI 2018 Day1」Election 记C为1,T为-1,\(sum[i]\)为\(i\)点的前缀和. 对于询问\([l,r]\),分两步计算答案. 要求所有点的\(sum[i]- ...

  2. 「ZJOI2014」璀灿光华

    「ZJOI2014」璀灿光华 实际上,可以不用建水晶立方体... 因为,发光水晶的方向都要枚举一遍. 只需知道发光水晶每个方向有哪些水晶就可以了. 对于一个发光水晶,将它连接的水晶标号. 从该水晶bf ...

  3. [POI2009]SLO-Elephants

    首先可以发现我们可以发现最终状态和初始状态都是一个大小为 \(n\) 的排列,且恰好有 \(n\) 种关系,于是我们对于每个 \(a_i\) 连一条 \(a_i \rightarrow b_i\) 的 ...

  4. ssh中“Host key verification failed.“的解决方案

    SSH连接的时候Host key verification failed. ➜ ~ ssh root@192.168.1.88 @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ ...

  5. 调试程序Bug-陈棚

    1.使用NSAssert 主要可以作为自定义bug的返回信息,对调试极为方便知道bug出现在哪 NSAssert()只是一个宏,用于开发阶段调试程序中的Bug,通过为NSAssert()传递条件表达式 ...

  6. 如何定制docker容器的系统时间

    Dockerfile加入下面一句(标红的部分): FROM xxxxxxENV JAVA_OPTS="-Dfile.encoding=UTF-8"ENV TZ=Asia/Shang ...

  7. mybatis 字段类型映射一览表

  8. 安卓手机超频CPU（无修饰CPU控制）

    手机软件内存越占越大,手机硬件配置太低运行太卡.其实可以通过超频cpu提升性能,安卓智能手机cpu怎么超频下面我来演示手机如何超频cpu.   方法/步骤     打开无修饰CPU控制.   设置CP ...

  9. 【论文总结】Zero-Shot Semantic Segmentation

    论文地址:https://arxiv.org/abs/1906.00817 代码:https://github.com/valeoai/ZS3 一.内容 Step 0:首先使用数据集(完全不包含 Un ...

  10. Docker入门的亿点点学习

    前段时间花了些时间学习了亿点点docker,也算是入门了吧,顺便记了一下笔记拿出来分享给想要接触docker的兄弟们. 没有服务器的兄嘚可以去腾讯云或者阿里云领取免费的试用产品嗷,如果已经领取过了,又 ...