PHP和ajax请求_「jQuery+PHP」ajax请求以及接口PHP响应教程

各位客官好，平时我们在开发时，不可避免的会用到Ajax与后台做数据交互，那么今天小编今天就给各位没有用过Ajax的客官以及准备接触的客官讲解一下，并且小编会为大家讲一下请求时的loading层等待以及php的sleep延时执行。

首先，我们为大家做一些准备工作，一个html文件，一个php文件，一个jQuery库，因为jQuery的代码量要小于原生js，所以我们选择jQuery的ajax写法，如下图。

小编是纯手打现写的，可以看到，我们的文件只有0KB和1KB大小，各位客官看在小编辛苦可以点个赞，点个关注，谢谢客官。

那么我们现在开始编写html代码以及jquery代码，首先我们随便写一个标签，并且为标签绑定点击事件，我们在点击时请求ajax。

然后我们为大家写一个jQuery的ajax的标准写法，注释我已经为大家写好了，大家可以细心看一下，我们这次就先用ajax的成功返回处理在里面编写，先无视其他几种数据处理。

之后我们在php文件中写一个简单的数据接口，接受数据，并且返回给前台一个json的数据。

下面我们可以通过console.log将返回数据打印到控制台。

我们看到右侧控制台，已经返回了我们在php文件中echo出json格式的数据，看到这个返回数据，也就是我们成功再前台用Ajax请求php，并且php成功返回给前台数据，那么下面我们为大家在请求时加一个loding层，提高一下用户视觉上的体验。

效果如下，当我们请求的时候，将事先写好的loading层显示，之后当请求成功之后，将loading层隐藏即可。

代码如下修改。

这样，我们的效果就出来了，当然，小编这里只是为各位客官测试，写的比较少，客官们可以在实际应用中变换写法，实现更多的效果。

提示，该效果因为涉及到了php文件，客官们再测试的时候需要在环境下测试，否则会报错的。小编也同时虚心的欢迎各位大神的指教和纠错，也欢迎没太懂的同学进行一个留言，小编会第一时间看到之后进行回复的。

客官大人，小编文笔不是很好，但是每天坚持手写文章，每天都会用心花几个小时更新文章您的关注点赞转发是小编最大的动力 (* ￣3)(ε￣ *)

PHP和ajax请求_「jQuery+PHP」ajax请求以及接口PHP响应教程相关推荐

python requests 400错误_「http 400」http请求报400错误的原因分析 - seo实验室
http 400 http 400 错误 - 请求无效 (Bad request) 在ajax请求后台数据时有时会报 HTTP 400 错误 - 请求无效 (Bad request);出现这个请求无效 ...
jq select 修改选中_「jquery select」jquery操作select(取值，设置选中） - seo实验室
jquery select 最近工作中总出现select 和 option问题,整理一下,内容大部分源于网络资料一.基础取值问题例如 1.设置value为pxx的项选中 $(".sele ...
java 常用函数式接口_「java8系列」神奇的函数式接口
前言在上一篇Lambda的讲解中我们就提到过函数式接口,比如:Consumer consumer = (s) -> System.out.println(s);其中Consumer就是一个函数 ...
jquery中ajax中的参数,jquery中的ajax参数
jquery中将ajax封装成了函数,我们使用起来非常方便,jquery会自动根据内容选择post还是get方式提交数据,并且会自动编码,但是要想完全掌握jquery中的ajax,我们必须将它的各个参 ...
java8 lambda maplist排序_「java8系列」流式编程Stream
前言「Java8系列」神秘的Lambda 「Java8系列」神奇的函数式接口继上两篇之后,本文已经java8系列的第三篇了.本篇文章比较长,但我希望大家都能认真读完.读不完可以先收藏,在找时间读. ...
【AJAX 笔记】AJAX 基本、HTTP 基本、原生 AJAX 的使用，jQuery / Axios / fetch 发送请求、跨域（JSONP/CORS）
文章目录 1 Ajax 概述 1.1 AJAX 简介 1.2 XML 简介 1.3 AJAX 的特点 1.3.1 AJAX 的优点 1.3.2 AJAX 的缺点 1.4 AJAX 属性和方法 2. H ...
dreamweaver 正则表达式为属性值加上双引号_「前端篇」不再为正则烦恼
作者:李一二转发链接:https://mp.weixin.qq.com/s/PmzEbyFQ8FynIlXuUL0H-g 前言有不少朋友都为写正则而头疼,不过笔者早已不为正则而烦恼了.本文分享一些 ...
自定义变量配置文件_「系统架构」Nginx调优之变量的使用（3）
在上一篇文章「系统架构」Nginx调优之变量的使用(2)中我们介绍了自定义变量和内置变量,下面我们继续接着介绍Nginx中变量的可见性和动态内置变量. 变量的可见性 nginx中的变量虽然不全是全局变 ...
jq发送动态变量_「系统架构」Nginx调优之变量的使用（3）
在上一篇文章「系统架构」Nginx调优之变量的使用(2)中我们介绍了自定义变量和内置变量,下面我们继续接着介绍Nginx中变量的可见性和动态内置变量. 变量的可见性 nginx中的变量虽然不全是全局变 ...

PHP和ajax请求_「jQuery+PHP」ajax请求以及接口PHP响应教程

PHP和ajax请求_「jQuery+PHP」ajax请求以及接口PHP响应教程相关推荐

最新文章

热门文章