thinkphp5最最最最简单的ajax实例

2018/07/10 15:56
阅读数 52

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  }

 

 

二、thinkphp5最最最最简单的ajax实例

1、演示截图

 

2、目录结构

 

 

2、代码

index.html

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>TestAjax</title>
 6     <script src="__HOMEPAGE__/js/jquery.min.js"></script>
 7     <style>
 8         div:first-child{
 9             text-align: center;
10             margin-top: 100px;
11         }
12     </style>
13 </head>
14 <body>
15 <div>
16     <input type="text" placeholder="请输入姓名">
17     <div>
18         <button id="my_ajax_test">确认</button>
19     </div>
20 </div>
21 </body>
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>
31 </html>

 

TestAjax.php

 1 <?php
 2 namespace app\index\controller;
 3 
 4 use app\index\controller\Base;
 5 
 6 class TestAjax extends Base
 7 {
 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     }
17 }

 

 

 

 
展开阅读全文
打赏
0
0 收藏
分享
加载中
更多评论
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部