如需将请求发送到服务器,我们使用 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. SQLServer数据库的状态一直都是正在还原

    解决方案: 执行以下SQL语句 restore database [数据库名称] with recovery

  2. C++ windows进程间通信

    最近一直在找共享内存同步的操作,恰好这篇文章有讲解.本文转载:https://blog.csdn.net/bing_bing_bing_/article/details/82875302 方便记录,c ...

  3. 浅谈由管理者角色引出的B端产品设计思考点

    本文来自网易云社区 作者:任琼瑶 最近一直都在持续跟进云课堂B端的交互设计,在此期间,多多少少遇到了一些不曾遇到过的问题,虽然同是做产品设计,但B端和C端产品的确存在很多不同之处. 首先,当我们在做C ...

  4. Promise之你看得懂的Promise

    本文由作者陈旭锋(任职网易考拉)授权网易云社区发布. Promise源码详解 学习知识要善于思考,思考,再思考. -- 爱因斯坦 1.回调地狱 曾几何时,我们的代码是这样的,为了拿到回调的结果,不得不 ...

  5. ADB模块源码分析(二)——adb server的启动

    1. ADB Server的启动 前面我们讲到adb模块的源码在system/core/adb下面,通过查看Android.mk文件我们了解到这个adb 模块回编译生成连个可执行文件adb.adbd, ...

  6. order by 使用注意

    create table user ( id int primary key, name varchar(11) , depid int ); create table dept( id int pr ...

  7. sonarLint和sonarQube

    在线安装和离线装sonarLint https://blog.csdn.net/limm33/article/details/51166840 下载指定版本的sonarLint https://bin ...

  8. 基本项目框架搭建 sqlserver druid配置

    1.  我的连接池采用的是阿里云的druid的连接池,工具是IDEA 框架是springboot+maven 以下是我的项目框架结构 2. pom  中配置 <?xml version=&quo ...

  9. Lambda入门

    Lambda 来源于微积分数学中的 λ,其涵义是声明为了表达一个函数具体需要什么. Table of contents Introduction 使用 Introduction 什么是Lambda? ...

  10. day 08 课后作业

    # -*- coding: utf-8 -*-# @Time : 2018/12/27 17:27# @Author : Endless-cloud# @Site : # @File : day 8课 ...