如需将请求发送到服务器，我们使用 XMLHttpRequest 对象的 open() 和 send() 方法：
xmlhttp.open("GET","ajax_info.txt",true);//打开文件
xmlhttp.send();// 发送数据
open(method,url,async)：

规定请求的类型、URL 以及是否异步处理请求。

  • method：请求的类型；GET 或 POST
  • url：文件在服务器上的位置
  • async：true（异步）或 false（同步）
send(string)

将请求发送到服务器。
string：仅用于 POST 请求；
 

GET 还是 POST？

与 POST 相比，GET 更简单也更快，并且在大部分情况下都能用。

然而，在以下情况中，请使用 POST 请求：

  • 无法使用缓存文件（更新服务器上的文件或数据库）
  • 向服务器发送大量数据（POST 没有数据量限制）
  • 发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠
 

语法AJAX方法：

$.ajax({name:value, name:value, ... })
 <!DOCTYPE html>

 <htmllang="en">

 <head>

 <metacharset="UTF-8"/>

 <title>Document</title>

 </head>

 <body>

 姓名：<inputtype="text"name="user">

 年龄：<inputtype="text"name="age">

 <inputtype="button"value="输入">

 <divstyle="border:1px solid red;padding:30px">

 <h2>你的信息：</h2>

 <p>XXX</p>

 <p>XXX</p>

 </div>

 </body>

 <scripttype="text/javascript"src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>

 <scripttype="text/javascript">

 var $btn = $("input[type=button]");

 var $input = $("input[type=text]");

 var $p = $("p");

 $btn.on("click",function(){

 $.ajax({

 type:"get",// 请求方式；

 url:"1-jq-ajax-get.php",// 连接服务器数据地址；

 data:{name:$input.eq(0).val(), age:$input.eq(1).val()},// 传输的数据

 dataType:"json",//传过来的数据类型

 success:function(data){

 console.log(data);//成功的时候

 $p.eq(0).text(data.name);

 $p.eq(1).text(data.age);

 },

 error:function(){

 // 传输失败

 console.log("请求失败！");

 }

 });

 });

 </script>

 </html>

 使用ajax的get的方法：$.get:
 <!DOCTYPE html>

 <htmllang="en">

 <head>

 <metacharset="UTF-8"/>

 <title>Document</title>

 </head>

 <body>

 姓名：<inputtype="text"name="user">

 年龄：<inputtype="text"name="age">

 <inputtype="button"value="输入">

 <divstyle="border:1px solid red;padding:30px">

 <h2>你的信息：</h2>

 <p>XXX</p>

 <p>XXX</p>

 </div>

 </body>

 <scripttype="text/javascript"src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>

 <scripttype="text/javascript">

 var $btn = $("input[type=button]");

 var $input = $("input[type=text]");

 var $p = $("p");

 $btn.on("click",function(){

 // 使用jq的ajax的get方法

 // $.get("1-jq-ajax-get.php");

 $.get("1-jq-ajax-get.php",{ name:$input.eq(0).val(), age:$input.eq(1).val()},function(data){

 console.log(data);

 $p.eq(0).text(data.name);

 $p.eq(1).text(data.age);

 },"json");

 });

 </script>

 </html>
 
使用ajax的post的方法：$.post:
$.post(url,[data],[callback],[type]);
$.post("test.php", { name: "John", time: "2pm" },

function(data){

process(data);

}, "xml");

JQuery ajax-向服务器发送请求的方法的更多相关文章

  1. 【03】AJAX 向服务器发送请求

    AJAX 向服务器发送请求   创建 XMLHttpRequest 对象后,就可以向服务器发送请求了. XMLHttpRequest 对象的 open() 方法和 send() 方法用来向服务器发送请 ...

  2. AJAX - 向服务器发送请求请求

    AJAX - 向服务器发送请求请求 XMLHttpRequest 对象用于和服务器交换数据.直线电机生产厂家 向服务器发送请求 如需将请求发送到服务器,我们使用 XMLHttpRequest 对象的 ...

  3. AJAX向服务器发送请求

    使用 XMLHttpRequest 对象的 open() 和 send() 方法: 方法 描述 open(method,url,async) 规定请求的类型.URL 以及是否异步处理请求. metho ...

  4. Ajax学习系列——向服务器发送请求

    1.如何发送请求? 如果需要向服务器发送请求,我们使用的是XMLHttpRequest对象中的open()和send()方法. var xhr = new XMLHttpRequest();//具体创 ...

  5. jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据

    jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据 这个是jQuery 的底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等. $.ajax() ...

  6. ajax-向服务器发送请求

    ajax-向服务器发送请求 1.将请求发送到服务器,使用XMLHttpRequest对象的 open() 和 send() 方法.     xmlhttp. open(method,url,async ...

  7. Ajax向服务器端发送请求

    Ajax向服务器端发送请求 Ajax的应用场景 页面上拉加载更多数据 列表数据无刷新分页 表单项离开焦点数据验证 搜索框提示文字下拉列表 Ajax运行原理 Ajax 相当于浏览器发送请求与接收响应的代 ...

  8. android客户端向服务器发送请求中文乱码的问

    android客户端向服务器发送请求的时候,并将参数保存到数据库时遇到了中文乱码的问题: 解决方法: url = "http://xxxx.com/Orders/saveorder.html ...

  9. Ajax向服务器发起请求

    Ajax向服务器发起请求的三个步骤: 1:创建Ajax 2:打开Ajax,打开Ajax请求 3:向服务器发起请求:需要知道地址和是get请求还是post方法 向服务器发起请求的两个方法:open 和 ...

随机推荐

  1. Katalon Studio简单使用(二)

    距离上一篇更新katalon学习部分已有两个月的时间 ,我的博文的访问量为400多,(*^__^*) 嘻嘻…… 说明还是很多同学在学习这个小tools的.所以再记录下 近两个月来对katalon的体验 ...

  2. 知识记录——Session与Cookie

    Session: Session是“会话”的意思,然而,因为http协议是无状态的,那么每次客户端请求服务器端,服务器端都会以“崭新”的页面展示给客户端,这在静态的html页面中是不会存在任何影响,但 ...

  3. IIS服务器添加网站

    1.添加IIS服务:对“我的电脑”右键,管理,点击服务和应用程序,如果下面没有”Internet Information Services(IIS)管理器“,打开控制面板,点击程序,启用或者关闭Win ...

  4. 有效单词词广场——算法面试刷题5（for google），考察数学

    给定一个单词序列,检查它是否构成一个有效单词广场.一个有效的单词广场应满足以下条件:对于满足0≤k<max(numRows numColumns)的k,第k行和第k列对应的字符串应该相同,. 给 ...

  5. 洛谷P4586 [FJOI2015]最小覆盖双圆问题（最小圆覆盖）

    题面 传送门 前置芝士 最小圆覆盖 题解 我们按照\(x\)坐标排序,然后二分中间点,把点分成左右两边,对两边都做一个最小圆覆盖,那么半径大一点的那个就是答案了.然后对半径大的那一边继续二分就行了 然 ...

  6. Python 开发安卓Android及IOS应用库Kivy安装尝试

    Python 开发安卓Android及IOS应用库Kivy安装尝试: 先来看看这货可以用来制作什么应用: Create a package for Windows Create a package f ...

  7. (二)SSO之CAS框架单点退出,自定义退出界面.

    用CAS的退出,只能使用它自己的那个退出界面,如果有这样的要求, 要求退出后自动跳转到登录界面, 该如何做呢?下面这篇文章实现了退出后可以自定义跳转界面.  用了CAS,发现退出真是个麻烦事,退出后跳 ...

  8. Lucene7.4学习和简单使用

    简述: 前面从新回顾学习了Solr,正好也借此机会顺便学习一下Lucene. 一.什么是Lucene? 全文检索的一个实现方式,也是非结构化数据查询的方法.应用场景:在数据量大,数据结构不固定的时候, ...

  9. 43.oracle同义词

    不愿长大,好多人如此,其实这是一种逃避责任没有担当的表象. 同义词 从字面上理解就是别名的意思,和视图的功能类似,就是一张映射关系. 私有同义词:一般是普通用户自己建立的同义词,创建者需要create ...

  10. Log中关于zVideoApp与zChatApp之间的消息传递可以搜索以下字符串

    [CSSBConfIPCAgent::OnMessageReceived]  (这是zVideoApp端的) 和 [CSSBPTIPCListener::OnMessageReceived]      ...