如需将请求发送到服务器,我们使用 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. org.springframework.dao.CannotAcquireLockException解决

    java.sql.SQLException: Lock wait timeout exceeded 该异常为一个service中调用了另一个service,两个service对同一表进行操作,造成事务 ...

  2. 【OCP题库-12c】最新CUUG OCP 071考试题库(70题)

    70.(31-2)choose the best answer: View the Exhibit and examine the structure of the Book table. The B ...

  3. HTML防止input回车提交表单

    原链接:https://blog.csdn.net/ligang2585116/article/details/44699567 自动提交情况说明: 1.默认情况下,单个输入框,无论按钮的type=& ...

  4. hadoop-1.2.1-1.x86_64.rpm、jdk-7u45-linux-x64.tar.gz安装(64位)

    一,   配置信息 机器是64位,所以操作系统.软件都是64位的. 操作系统:CentOS6.2(64位): Hadoop是hadoop-1.2.1-1.x86_64.rpm: JDK是jdk-7u4 ...

  5. php全局变量漏洞 $GLOBALS

    在Discuz代码中有这么一段: if (isset($_REQUEST[‘GLOBALS’]) OR isset($_FILES[‘GLOBALS’])) {  exit(‘Request tain ...

  6. 喝最烈的酒、挖最大的DONG——工具与技巧篇

    本文作者:i春秋签约作家——黑色镰刀 0×00 前言 在这个科技发达的时代,很多时候工具都可以代替人做很多事情,之前我就有谈起过有企业将人工智能运用于网络安全方面,像如今,也有更多更人性化更智能的工具 ...

  7. 【javascript】判断是否微信浏览器的最佳实践

    根据判断UA中是否有关键字micromessenger,有的话则是微信内置浏览器 用Chrome的iPhone5模拟测试 //判断是否微信登陆 function isWeiXin() { var ua ...

  8. multiprocess(上)

    仔细说来,multiprocess不是一个模块而是python中一个操作.管理进程的包. 之所以叫multi是取自multiple的多功能的意思,在这个包中几乎包含了和进程有关的所有子模块.由于提供的 ...

  9. graphviz画图与中文乱码等问题总结

    最近想写一些文档,画一些程序的逻辑图,用了vision,markdown等软件感觉不怎么好用,于是找到graphviz,这款强大的软件.下面介绍一些入门,还有自己在用的过程中遇到的问题 1.中文乱码的 ...

  10. iOS --高仿QQ空间页面

    1.首先分析一下qq空间页面的主要2个功能: 1)随着TableView的向上滑动导航栏的颜色渐变,变化过程是从透明变成白色. 2)随着TableView的向下滑动,图片随着offset放大. 2.首 ...