会员可以在此提问,百战程序员老师有问必答
对大家有帮助的问答会被标记为“推荐”
看完课程过来浏览一下别人提的问题,会帮你学得更全面
截止目前,同学们一共提了 132647个问题
WEB前端全系列/第五阶段:前后端交互/PHP、数据库编程与设计 107楼

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/jquery.min.1.12.4.js"></script>
</head>
<body>
<span>用户名:</span><input type="text" class="username"><br>
<span>密码:</span><input type="text" class="password"><br>
<button>get无参请求</button>
<button>get有参请求</button>
<button>post请求</button>
<script>
    var $usernameInput=$('.username');
    var $passwordInput=$('.password');
    var $btns=$('button');
    $btns.eq(0).click(function () {
        $.ajax({
            //请求方式为get
            type:'get',
            //指明请求要发送到的php后台地址
            url:'ajax.php',
            //交互的数据格式为json
            dataType:'json',
            //当后台返回数据时,本函数自动执行,用来获取后台返回的具体数据内容
            success:function (res) {
                console.log(res);
                console.log(res.info);
            }
        })
    })

    $btns.eq(1).click(function () {
        $.ajax({
            //请求方式位get
            type:'get',
            //指明请求要发送到的php后台
            url:'ajax.php?username='+$usernameInput.val()+'$password='+$passwordInput.val(),
            //交互的数据格式为json
            dateType:'json',
            //当后台返回数据时,本函数自动执行,用来获取后台返回的具体数据内容。
            success:function (res) {
                console.log(res);
                console.log(res.info);
            }
        });
    })
</script>
</body>
</html>
<?php
  //get无参请求
  //php中构建数组结构
  //$successArr=array('msg'=>'ok','info'=>'my tel is 1794309196xxx');
  //通过echo和json——encode()方法将这个数组转换成json,并返回到前端
  //echo json_encode($successArr);
  //get无参请求
    //php中构建数组结构
    $successArr=array('msg'=>'ok','info'=>$_GET);
    //通过echo和json——encode()方法将这个数组转换成json,并返回到前端
    echo json_encode($successArr);
?>

image.png

为什么是未知啊,哪里出错了

WEB前端全系列/第五阶段:前后端交互/PHP、数据库编程与设计 108楼
WEB前端全系列/第五阶段:前后端交互/PHP、数据库编程与设计 109楼
WEB前端全系列/第五阶段:前后端交互/PHP、数据库编程与设计 110楼

老师我在使用get 有参请求和post 请求时为什么打印不出来呢?

网上找到方法在php的开头加

ini_set("error_reporting","E_ALL & ~E_NOTICE");
发现打印的是  {12: "34", info: null}
为什么info 是Null
<!doctype html>
<html lang="us">
<head>
    <meta charset="utf-8">
    <title>jqajax</title>
    <script src="jquery-3.5.1.js"></script>
</head>
<style>
    button{
        padding:4px;
    }
</style>
<body>
<span>用户名:<input type="text"  class="usename" /> </span><br>
<span>密码:<input type="text"  class="password" /> </span><br>
<button>get无参</button>
<button>get有参</button>
<button>post请求</button>
<script>
var $name=$('.usename')
var $pass=$('.password')
var button= $('button')
//get 有参请求
button.eq(1).click(function () {
    $.ajax({
        //调用方式
        type: "GET",
        //发送的后台地址
        url: 'jqajax.php?username='+$name.val()+'&content='+$pass.val(),
        // data: {username:$name.val(), content:$pass.val()},
        //交互的数据格式
        dataType: "json",
        //当后台返回数据时,本函数自动执行,用来获取后台返回的具体数据内容
        success: function(res){
            console.log(res)
        }
    });
})
//post请求
button.eq(2).click(function () {
    $.ajax({
        //调用方式
        type: "post",
        //发送的后台地址
        url: 'jqajax.php',
        data: {username:$name.val(), content:$pass.val()},
        //交互的数据格式
        dataType: "json",
        //当后台返回数据时,本函数自动执行,用来获取后台返回的具体数据内容
        success: function(res){
            console.log(res)
        }
    });
})
</script>
</body>
</html>
<?php
 //get有参请求
   //$__GET//表示前端请求方式为get   并把前端传参带过来
      $arr=array('12'=>'34','info'=>$__GET);
   //通过echo 和 json_encode()方法将这个数据转换为json,并返回前端
       echo json_encode($arr);
 //$__POST//表示前端请求方式为post   并把前端传参带过来
       $arr=array('12'=>'34','info'=>$__POST);
  //通过echo 和 json_encode()方法将这个数据转换为json,并返回前端
                echo json_encode($arr);
  ?>


WEB前端全系列/第五阶段:前后端交互/PHP、数据库编程与设计 111楼

老师,用post请求接收不到前台返回的数据

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/jquery-3.5.1.js"></script>
</head>
<body>
<span>用户名:</span><input type="text" class="username"><br>
<span>密码:</span><input type="text" class="password"><br>
<button>get无参请求</button>
<button>get有参请求</button>
<button>post请求</button>
<script>
    /*
    Ajax
    描述 Ajax全称为Asynchronous JavaScript and XML
         是一种前后台数据交互的手段
    说明 原生的Ajax实现比较麻烦,需要借助xmlhttprequest对象来构建
         而今天我们实现的是jQuery已经封装好的现成方法
    说明 get无参请求 一般用来向后台获取数据使用,不会发送给后台内容
         get有参请求 一般向贴吧、社区等需要根据页码或者指定的属性来获取数据使用,
                     这种情况下参数一般都比较小
         post请求    一般用于登录、注册等保密性高的地方
     */
    var $usernameInput=$('.username');
    var $passwordInput=$('.password');
    var $btns=$('button');
    $btns.eq(0).click(function () {
        $.ajax({
            //请求方式为get
            type:'get',
            //指明请求要发送到的php后台地址
            url:'10jqAjax请求.php',
            //交互的数据格式为json
            dataType:'json',
            //当后台返回数据时,本函数自动执行,用来获取后台返回的具体数据内容
            success:function (res) {
                console.log(res);
                console.log(res.info);
            }
        });
    })
    $btns.eq(1).click(function () {
        $.ajax({
            //请求方式为get
            type:'get',
            //指明请求要发送到的php后台地址
            url:'10jqAjax请求.php?username='+$usernameInput.val()+"password"+$passwordInput.val(),
            //交互的数据格式为json
            dataType:'json',
            //当后台返回数据时,本函数自动执行,用来获取后台返回的具体数据内容
            success:function (res) {
                console.log(res);
                console.log(res.info);
            }
        });
    })
    $btns.eq(2).click(function () {
        $.ajax({
            //请求方式为post
            type:'post',
            //指明请求要发送到的php后台地址
            url:'10jqAjax请求.php',
            date:{
                uname:$usernameInput.val(),
                upass:$passwordInput.val()
            },
            //交互的数据格式为json
            dataType:'json',
            //当后台返回数据时,本函数自动执行,用来获取后台返回的具体数据内容
            success:function (res) {
                console.log(res);
                console.log(res.info);
            }
        });
    })
</script>
</body>
</html>

<?php
     //post请求
     //php中构建数组结构
     $successArr= array('msg'=>'ok','info'=>$_POST);
     //通过echo和json_encode(对象)方法将这个数组转换成json,并返回到前端
     echo json_encode($successArr);
?>

blob.png

WEB前端全系列/第五阶段:前后端交互/PHP、数据库编程与设计 116楼
WEB前端全系列/第五阶段:前后端交互/PHP、数据库编程与设计 117楼
WEB前端全系列/第五阶段:前后端交互/PHP、数据库编程与设计 119楼
WEB前端全系列/第五阶段:前后端交互/PHP、数据库编程与设计 120楼

课程分类

百战程序员微信公众号

百战程序员微信小程序

©2014-2025百战汇智(北京)科技有限公司 All Rights Reserved 北京亦庄经济开发区科创十四街 赛蒂国际工业园
网站维护:百战汇智(北京)科技有限公司
京公网安备 11011402011233号    京ICP备18060230号-3    营业执照    经营许可证:京B2-20212637