jQuery获取后台数据

523 阅读1分钟

ajax获取数据

 <script>
        /* 发送用户名和密码给后台,后台拿到数据,去数据库验证,存在返回成功,不存在返回不存在该用户 */
        /* 点击登录调取后台接口 */
        function login() {
            if (!$('input[type=text]').val().trim() || !$('input[type=password]').val().trim()) {
                alert('用户名或者密码不能为空')
                return
            }
            $.ajax({
                url:"http://timemeetyou.com:8889/api/private/v1/login",
                method:"post",/* 因为登录要加密,所以用post */
                data:{
                    username:$('input[type=text]').val(),
                    password:$('input[type=password]').val()
                },
                success:function(res){
                    if(res.meta.status!=200){
                        alert(res.meta.msg)
                        return;
                    }
                }
            })

post方法简写:

  /* post简写  */
            let url = "http://timemeetyou.com:8889/api/private/v1/login";
            $.post(url, {
                username: $('input[type=text]').val(),
                password: $('input[type=password]').val()
            }, function (res) {
                if (res.meta.status != 200) {
                    alert(res.meta.msg)
                    return;
                }
                alert(res.meta.msg)
            })
        }

get方法请求


<script>
        /* ?后面就代表传入的参数 */
        /* $.get('a.json?name=zhangsan&age=29',function(res){
            console.log(res)
        }) */
        /* 第二种传参的方式 */
        /* $.get('a.json',{name:'zhangsan',age:29},function(res){
            console.log(res)
        }) */
        /* 使用get请求,参数传sex=性别和dec=你希望的ta的描述 */
        /* 获得 一个女朋友的信息,名字和身高和颜值 json文件 */
        /* 展示到页面上 */

        /* 接口地址b.json */
        /* 后台需要你传给他的 参数 根据你给的参数  帮你匹配到符合的数据*/
        $.get('b.json',{sex:'女',dec:"性格要好"},function(res){
            /* 后台返回给你的数据 */
            console.log(res)
            $('body').prepend(`<h3>${res.name}</h3>`)
            $('body').prepend(`<h3>${res.age}</h3>`)
            $('body').prepend(`<h3>${res.yz}</h3>`)
        })
    </script>