Ajax异步(客户端测试)

客户端测试:GET方法实现Ajax异步

var request = new XMLHttpRequest();

                         request.open("GET","sever.php?number="+ document.getElementById("keyword").value);

                         request.send();

                        

                         request.onreadystatechange = function(){

                                  if(request.readyState === 4)

                                  {

                                          if(request.status === 200)

                                            {

                                                    //更新查询结果的内容

                                                    document.getElementById('search_result').innerHTML = request.responseText;

                                                    }

                                      else{

                                                  alert("发生错误"+ request.status)

                                                  }

                                          }

                         }

Content-Type表示:数据的类型,如果设置错误,造成错误的信息

POST 发送请求

document.getElementById('savebtn').οnclick=function(){

                         //发送请求

                         var request = new XMLHttpRequest();

                         var data = "name=" + document.getElementById('staffName').value

                                    +"&number=" + document.getElementById('staffNumber').value

                                             +"&sex=" + document.getElementById('staffSex').value

                                             +"&job=" + document.getElementById('staffJob').value

                         request.open("POST","sever.php?");

                 //

       设置请求头

        request.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

                         request.send(data);

                        

                         request.onreadystatechange = function(){

                                  if(request.readyState === 4)

                                  {

                                          if(request.status === 200)

                                            {

                                                    //更新查询结果的内容

                                                    document.getElementById('create_result').innerHTML = request.responseText;

                                                    }

                                      else{

                                                  alert("发生错误"+ request.status)

                                                  }

                                          }

                         }

                        

                        

                        

                         }

6:JSON方式传送数据

JSON存储交换信息的语法是javascript对象

 

var json = '{"staff": [{"name": "张三","age": "10"},{"name": "张三","age": "20"}]}';

                                 

                                  var jsonobj = JSON.parse(json);//JSON字符串转换成javascript对象

                                  console.log(jsonobj.staff[0].name);

可以使用现在校验工具直接检查JSON字符串的格式

 

JSON的方式返回,在客户端需要进行转换,JSON.parse(),服务端不需要

$result = '{"success":true,"msg":"找到员工:员工编号:' . $value["number"] .

                                                           ',员工姓名:' . $value["name"] .

                                                           ',员工性别:' . $value["sex"] .

                                                           ',员工职位:' . $value["job"] . '"}';

通过字符串来传递数据

转载于:https://www.cnblogs.com/love-life-insist/p/9063791.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/251725.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

VS 添加文件添加文件成链接

转载于:https://www.cnblogs.com/wsxkit/p/10907585.html

设计模式——3.观察者模式

观察者模式(Observer) 观察者模式(Observer)简介: 定义一个一对多的依赖关系,让多个观察者对象监听某个主题对象,当主题对象的状态发生改变时,主题对象则通知所有的观察者对象&#…

Android 长按照片保存 工具类

2019独角兽企业重金招聘Python工程师标准>>> public class ImgUtils {public static void saveImageToGallery(Context context, Bitmap bmp) {final String[] items new String[] { "保存图片"};//图片转成Bitmap数组final Bitmap[] bitmap new Bitmap…

knockout + easyui = koeasyui

在做后台管理系统的同学们,是否有用easyui的经历。虽然现在都是vue、ng、react的时代。但easyui(也就是jquery为基础)还是占有一席之地的。因为他对后端开发者太友好了,太熟悉不过了。要让一个后端开发者来理解vue或者是react的VN…

轻量社交APP系统ThinkSNS 简 权威发布 限时惠购

2019独角兽企业重金招聘Python工程师标准>>> 伴随国内外创业风潮、AI、区块链等互联网软件科技领域的高速发展,2019年,ThinkSNS软件品牌迎来十周年后的新纪元。作为下一个阶段的产品元年,官方于2019年5月正式发售轻量核心社交APP系…

Spring Cloud Zuul网关(快速搭建)

zuul 是netflix开源的一个API Gateway 服务器, 本质上是一个web servlet应用。 在云平台上提供动态路由,监控,弹性,安全等边缘服务的框架。相当于是设备和 Netflix 流应用的 Web 网站后端所有请求的前门。主要功能是路由转发和过滤器。 Zuul可…

10.13 上午 考试

T1 直接二分就好了 #include <cstdio> #include <cstring> #include <iostream> #include <cmath> #include <cstdlib> #include <algorithm> #define ll long long #define mem(a,b) memset(a,b,sizeof(a)) using namespace std;ll n; in…

gbk 转 UTF-8

iconv命令 gbk 转 UTF-8 -----linux gbk 转 UTF-8-------- iconv 用法 iconv -f "gbk" -t "utf-8" < infile > outfile 或者 piconv -f "gbk" -t "utf-8" < infile > outfile iconv -f utf-8 -t GBK 123456.txt 对传文件…

珠宝条码打印扫描解决方案

随着人们生活水平的逐步提高&#xff0c;珠宝消费日益增长&#xff0c;据统计&#xff0c;我国珠宝首饰零售规模超过7000亿&#xff0c;过去5年复合增长为15%&#xff0c;是规模增长最为迅速的可选消费品类之一。面对千亿级的消费市场&#xff0c;珠宝行业竞争激烈&#xff0c;…

课程作业1

1使用组合数公式利用n!来计算 a.设计思想 定义n和k&#xff0c;用递归函数表示出N!的阶乘结果&#xff0c;c(n,k)n!/(k!(n-k)!);调用函数求出c(n,k)的结果 b.源代码 package kecheng1; import java.util.Scanner; public class Test {public static void main(String[] args) {…

新手学Python推荐的四本书籍+2个资源网站

2019独角兽企业重金招聘Python工程师标准>>> 很多伙伴初学Python&#xff0c;会问到&#xff1a;有没有好的学习书籍推荐&#xff1f;有没有好的学习网站推荐&#xff1f; 针对这类伙伴的问题&#xff0c;小优给大家整理了学习Python的四本书籍2个资源网站&#xff…

【转】Linux系统编程---dup和dup2详解

正常的文件描述符&#xff1a; 在linux下&#xff0c;通过open打开以文件后&#xff0c;会返回一个文件描述符&#xff0c;文件描述符会指向一个文件表&#xff0c;文件表中的节点指针会指向节点表。看下图&#xff1a; 打开文件的内核数据结构 dup和dup2两个函数都可以用来复制…

Java -----JVM运行时数据区

一、JVM体系结构 想要了解运行时数据区&#xff0c;先关注一下JVM的体系结构&#xff0c;知道数据区在JVM的整体位置和作用。 二、JVM运行时数据区 1.程序计数器 一块较小的内存空间&#xff0c;它是当前线程所执行的字节码的行号指示器&#xff0c;字节码解释器工作时通过改变…

20155235 《网络攻防》 实验八 Web基础

20155235 《网络攻防》 实验八 Web基础 实验内容 Web前端HTML(0.5分) 能正常安装、启停Apache。理解HTML&#xff0c;理解表单&#xff0c;理解GET与POST方法,编写一个含有表单的HTML。Web前端javascipt(0.5分) 理解JavaScript的基本功能&#xff0c;理解DOM。编写JavaScript验…

【每周一图】蜂鸟

摄影/祈澈姑娘小花园偶遇的一只蜂鸟转载于:https://www.cnblogs.com/wangting888/p/9702088.html

API网关如何实现对服务下线实时感知

上篇文章《Eureka 缓存机制》介绍了Eureka的缓存机制&#xff0c;相信大家对Eureka 有了进一步的了解&#xff0c;本文将详细介绍API网关如何实现服务下线的实时感知。 一、前言 在基于云的微服务应用中&#xff0c;服务实例的网络位置都是动态分配的。而且由于自动伸缩、故障和…

反射笔记-----------------------------

1.反射基本概念&#xff1a; 01.定义&#xff1a; 反射是指在程序运行期间&#xff0c;能够观察和修改类或者类的对象的属性和行为的特性&#xff01; 02.作用&#xff1a; 001.在运行期间获取类的修饰符&#xff0c;包名&#xff0c;类名&#xff0c;实现的接口&#xff0c;继…

kubernetes 集群部署

kubernetes 集群部署 环境JiaoJiao_Centos7-1(152.112) 192.168.152.112JiaoJiao_Centos7-2(152.113) 192.168.152.113JiaoJiao_Centos7-3(152.114) 192.168.152.114已开通 4C8G80G 集群规划 部署方式 环境准备&#xff1a;基于主机名称通信&#xff0c;时间同步&#xff0c;关…

wordpress 显示数学公式 (MathJax-LaTeX)

blog 不放一堆数学公式怎么能显得高大上&#xff0c;所以 MathJax-LaTeX 也是必装的插件之一了。 一、安装 MathJax-LaTex 插件 直接在 wordpress 插件中&#xff0c;搜索并安装 MathJax-LaTeX 二、安装本地 MathJax 服务 不过由默认的 MathJax cdn 服务经常被墙&#xff0c;所…

ConstraintLayout

ConstraintLayout使用笔记 具体使用参考&#xff1a;http://blog.csdn.net/guolin_blog/article/details/53122387 ConstraintLayout 好处还是很明显&#xff0c;确实可以减少嵌套。性能对比参阅&#xff1a;http://www.cnblogs.com/liujingg/p/7161319.html 简单嵌套Constrain…