ajax post 演示

最新推荐文章于 2023-07-17 11:54:28 发布
最新推荐文章于 2023-07-17 11:54:28 发布
阅读量326 收藏
点赞数
分类专栏： WEB前端开发 PHP后端开发
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yuqidai/article/details/52041767
版权 
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<!--<script src="jquery.js"></script>-->
<script>
//$(function(){})	//阻塞 -> 同步

//非阻塞 - 异步
/*setTimeout(function() {
	alert(1);
}, 2000);

alert(2);*/

window.onload = function() {
	
	var oBtn = document.getElementById('btn');
	
	
	oBtn.onclick = function() {
		
		var xhr = null;
		try {
			xhr = new XMLHttpRequest();
		} catch (e) {
			xhr = new ActiveXObject('Microsoft.XMLHTTP');
		}
		
		xhr.open('post','2.post.php',true);
		//post方式，数据放在send()里面作为参数传递
		xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');//申明发送的数据类型
		//post没有缓存问题
		//无需编码
		xhr.send('username=刘伟&age=30');
		
		xhr.onreadystatechange = function() {
			
			if ( xhr.readyState == 4 ) {
				if ( xhr.status == 200 ) {
					alert( xhr.responseText );
				} else {
					alert('出错了,Err：' + xhr.status);
				}
			}
			
		}
		
	}
}
</script>
</head>

<body>
	<input type="button" value="按钮" id="btn" />
</body>
</html>

戴宇琪
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
使用ajax向服务器发起post请求（提交数据给服务器）
Forever_Hopeful的博客
06-25 5250
前端开发：网络请求后台数据，使用ajax向服务器发起post请求（提交数据给服务器）
Ajax：ajax发送Post请求、ajax案例
dengfengling999的博客
07-21 1万+
上面项目，目前存在的缺点在后端的java代码中又开始拼接HTML代码了。显然这是在后端java中写前端的HTML代码。一般后端不会这样写拼html串返回，只会在后端查数据，把数据返回交给前端。能不能直接将数据返回，给WEB前端数据就行了。让WEB前端能够拿到数据就行，然后页面展示的功能交给WEB前端来处理。我们后端的java代码能不能只返回数据？（返回数据可以采用JSON的格式，也可以采用XML的格式）一般采用JSON，因为json体积小，xml体积大，解析起来有一定难度。......
Ajax-POST请求
热门推荐
廖若星辰-LTY
09-01 2万+
上文 Ajax-GET请求 已经对Ajax做了简单的介绍，也分享了Ajax中GET数据请求的底层实现以及jQuery封装后的使用方式。那么本文再来记录一下Ajax中POST数据请求方式的底层实现和jQuery封装后的使用。 Ajax最常用的请求服务器方式有GET和POST两种。 GET 请求服务器方式常用于获取服务器数据，而 POST 请求服务器方式常用于向服务器发送数据，可携带参数量较大。本文主要介绍Ajax中的POST请求服务器的原生底层写法和jQuery封装后的用法。 使用XMLHttpRequ
ajax请求 POST丨ajax简介,ajax提交数据的多种类型
灵感与学习结合-echo
01-26 4966
Ajax其实质是利用浏览器提供的一个特殊的对象（XMLHttpRequest）异步地向服务器发送请求，服务 器返回部分数据，浏览器让你去利用这些数据对象页面做部分的更新，整个过程，页面无刷新，不打断用 户的操作。同步和异步的区别同步：如果与服务器端的交互方式是同步，当客户端与服务器交互时，客户端就不能进行其他 操作，只能等待服务器端的响应，会刷新页面。异步：当客户端正在进行正常操作时，还可以同时与服务器进行交互，服务器响应客户端信息，将 信息更新到网页局部，整个过程页面不刷新。'''
AJAX发送请求(POST方式)
猫猫的小茶馆
05-16 2万+
AJAX请求 AJAX 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术： 这里介绍一下AJAX发送请求（POST） POST比GET提交方式更安全，不会在网址中显示信息 首先我们看一下效果 常见场景：输入用户名和密码 在用户登录时，这是最常见的用法。接下来，我们看看代码吧。 首先，老规矩，咱们写一个简单的PHP服务 PHP部分 代码如下： &...
Ajax中get和post区别
01-25
在上面的实例代码中，我们使用了Get和Post请求来演示两种请求方法的区别。在客户端代码中，我们使用XMLHttpRequest对象创建了一个Get请求和一个Post请求，并将参数传递给服务器端。在服务器端代码中，我们使用...
演示ajax
02-15
jQuery库提供了更简单的Ajax操作接口，如`$.ajax()`、`$.get()`和`$.post()`。以下是如何使用jQuery的`$.post()`发送Ajax请求： ```javascript $.post("process_data.php", { data: "helloWorld" }, function...
AJAX各种特效演示
05-12
在"AJAX各种特效演示"的压缩包中，可能包含了各种使用AJAX实现的特效实例，如动态加载内容、无刷新分页、下拉刷新、实时搜索建议等，这些都是AJAX在实际项目中的应用示例，可以帮助开发者更好地理解和学习AJAX技术。
ajax技术演示文稿
03-17
3. JavaScript通过XMLHttpRequest对象的open()方法设置请求类型（GET或POST）、URL和异步模式。 4. 发送请求，使用send()方法，通常将数据作为参数传递。 5. 服务器处理请求，返回数据（通常是XML或JSON格式）。 6. ...
Ajax实例演示Ajax实例演示
04-29
**Ajax实例演示** 在实际应用中，一个简单的Ajax实例可能涉及以下几个步骤： 1. 创建XMLHttpRequest对象：在JavaScript中，大部分现代浏览器都内置了XMLHttpRequest对象，我们可以通过`new XMLHttpRequest()`来创建...
ajax的post请求
逗号ing的博客
08-02 1万+
$.ajax({ type : "post",//请求方式,post请求 ,可以改成get请求 url : root+' ',//后台请求地址 dataType : "json",//后台返回值类型 contentType: "application/json", //如果提交的是json数据类型，则必须有此参数,表示提交的数据类型 async : false,//异步请求 ...
ajax的post请求方式,ajax的post请求方式
weixin_42519733的博客
08-06 5011
String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%>This is my JSP pagediv{border: 1px solid red;width:...
Ajax之post请求
杜小白的博客
07-13 7152
ajax之get请求需要注意的四个地方：给服务器传递数据需要调用send（请求字符串数据）方法调用方法setRequestHeader()把传递的数据组织为xml格式（模仿form表单传递数据）传递的中文信息无需编码，特殊符号像&amp;、=等仍需要编码该方式请求的同时也可以传递get参数信息，同样使用$_GET接收该信息ajax发起post请求服务器端03.php：&lt;?php //接收p...
【Ajax】ajax 基本使用 / 跨域问题 / get和post
one or only的博客
08-16 1470
【Ajax】ajax 基本使用 / 跨域问题 / get和post
JavaScript学习 -- ajax方法的POST请求
最新发布
weixin_41489908的博客
07-17 4667
本文介绍了如何使用jQuery发送POST请求，并提供了简单和带标头信息的请求的实际示例。使用jQuery可以方便地向服务器发送数据，并等待响应。在实际开发中，我们通常会使用POST请求来提交表单数据、发送文件或与服务器进行交互。
Ajax——发送POST请求
weixin_53052268的博客
08-13 1318
1.需求：鼠标移过div方框会将请求服务器返回的结果打印在div内。3.POST设置请求参数。
Ajax学习：Ajax发送POST请求
weixin_47295886的博客
11-28 1511
当鼠标移动到div区域的时候，发送post请求给服务端 把响应体内容在div中呈现。
【Ajax】笔记-POST请求(原生)
德仔
07-13 1313
height;border;
post和ajax提交
yishengqianan的博客
08-18 925
1、post提交 通过远程 HTTP POST 请求载入信息。 这是一个简单的 POST 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数 它的参数有： url:发送请求地址。 data:待发送 Key/value 参数。 callback:发送成功时回调函数。 type:返回内容格式，xml, html, script, json, text, _default。 post向服务器发送数据,也可以获得服务器处理之后的结果 POST请求不能被缓存. POST发送请求时,URL中只有资源路径,但不
ajax中get和post请求
07-16
在AJAX中，GET和POST是两种常见的请求方法。 1. GET请求：通过URL参数传递数据，将数据附加在URL的末尾。GET请求通常用于获取数据，不应该用于敏感信息的传递。GET请求的特点包括： - 数据以键值对的形式附加在URL后面，例如：`http://example.com/api?param1=value1&param2=value2` - GET请求对参数长度有限制，一般为2048个字符 - GET请求可以被缓存 - GET请求可以被收藏为书签 2. POST请求：通过HTTP消息体传递数据，将数据放在请求的消息体中。POST请求通常用于向服务器发送数据，包括敏感信息。POST请求的特点包括： - 数据不会附加在URL后面，而是通过消息体发送 - POST请求对参数长度没有限制 - POST请求不会被缓存 - POST请求不会被收藏为书签 在AJAX中，使用GET和POST请求可以通过XMLHttpRequest对象或者fetch函数来实现。例如，在JavaScript中使用XMLHttpRequest对象发送GET请求的示例代码如下： ```javascript var xhr = new XMLHttpRequest(); xhr.open('GET', 'http://example.com/api?param1=value1&param2=value2', true); xhr.onreadystatechange = function() { if (xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) { var response = xhr.responseText; // 处理响应数据 } }; xhr.send(); ``` 使用fetch函数发送POST请求的示例代码如下： ```javascript fetch('http://example.com/api', { method: 'POST', body: JSON.stringify({ param1: 'value1', param2: 'value2' }) }).then(function(response) { if (response.ok) { return response.json(); } else { throw new Error('Error: ' + response.status); } }).then(function(data) { // 处理响应数据 }).catch(function(error) { console.log(error); }); ``` 这些示例只是简单的演示，实际使用中可能需要根据具体情况进行参数的设置和错误处理。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值