ThinkPHP5 ajax使用

Posted 微笑范特西

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ThinkPHP5 ajax使用相关的知识,希望对你有一定的参考价值。

一句话总结:页面端使用$.get()方法传递ajax请求,服务器端判断是不是ajax请求,是的话接受参数,进行逻辑处理之后向客户端返回值。

1、页面端如何传递ajax请求?

$.get()方法即可

22 <script>
23 $(‘#my_ajax_test‘).click(function(){
24     var name=$(‘input‘).val();
25     //alert(name);
26     $.get("{:url(‘test_ajax/index‘)}",{name:name},function(data){
27         alert(‘Ajax从服务器端返回来的值是:‘+data);
28     });
29 });
30 </script>

 

2、服务器端如何判断是不是ajax请求?

request()->isAjax(),thinkphp5提供了ajax判断函数isAjax()

 8     public function index()
 9     {
10         if(request()->isAjax()){
11             $name=input(‘name‘);
12             return $name.‘ fry‘;
13             //dump($name);die;
14         }
15         return view();
16     }

举个栗子~:
前台代码:
  <script>
    var spirit = "";
    $.get("{:url(‘Music/mclist‘)}",function(data){
      console.log(data);
      
      var length = Object.keys(data).length;
      var brr = [];
      for(var i =0;i<length;i++){
        brr.push({
          title:data[i]["mc_name"],
          artist:data[i]["mc_singer"],
          mp3:data[i]["mc_url"],
          poster:""
        });
      }
      spirit = brr;
    });
  </script>

后台代码:

    public function mclist()
    {
        if (request()->isAjax()) {
            // $name = input(‘name‘);
            // return $name . ‘ fry‘;
            // //dump($name);die;
            $mclist = Db::table("music")->select();
            return $mclist;
        }
        return view();
    }

 




以上是关于ThinkPHP5 ajax使用的主要内容,如果未能解决你的问题,请参考以下文章

thinkphp5.0调用ajax无刷新加载数据

thinkphp5 Ajax搜索分页

AJAX相关JS代码片段和部分浏览器模型

Javascript代码片段在drupal中不起作用

前端面试题之手写promise

js和thinkphp5路由拼接一个实例