AJAX异步请求

最新推荐文章于 2023-07-01 20:41:16 发布
最新推荐文章于 2023-07-01 20:41:16 发布
阅读量225 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/dahaiziyu/article/details/57416474
版权
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>mytest</title>
<script>
function showCustomer(str)
{
  if (str=="")
  {
    document.getElementById("txtHint").innerHTML="";
    return;
  }  
  if (window.XMLHttpRequest)
  {
    
    xmlhttp=new XMLHttpRequest();
  }
  else
  {
    
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function()
  {
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
      document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
  xmlhttp.open("GET","sow.php?q="+str,true);
  xmlhttp.send();
}
</script>
</head>
<body>


<form action=""> 
<select name="customers" οnchange="showCustomer(this.value)">
<option value="">选择一个站点:</option>
<option value="RUNOOB">Runoob</option>
<option value="GOOGLE ">Google</option>
<option value="TAOBAO">Taobao</option>
</select>
</form>
<br>
<div id="txtHint">站点信息显示在这里...</div>


</body>

</html>

//以下是php代码

<?php 


$q = isset($_GET['q'])? htmlspecialchars($_GET['q']) : ""//三元运算

//if语句直接做判断；
/*if($q == ""){
echo  "";
}elseif ($q == "RUNOOB"){
echo "菜鸟教程
http://www.runoob.com";
}elseif ($q == "GOOGLE"){
echo  "Google 搜索
http://www.google.com";
}elseif ($q == "TAOBAO"){
echo  "淘宝
http://www.taobao.com";
}
*/

//或switch语句做判断；
switch ($q){
case ""
:echo "";
break;
case "RUNOOB"
:echo "菜鸟教程
http://www.runoob.com";
break;
case "GOOGLE"
:echo "Google 搜索
http://www.google.com";
break;
case "TAOBAO"
:echo  "淘宝
http://www.taobao.com";
break;
}
?>

dahaiziyu
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
ajax异步请求中途取消
weixin_42371145的博客
02-24 8472
应用场景 当前端需要即时搜索时，会不断的向后端请求ajax，但是前端仅仅需要最后一次的搜索结果，之前的请求全部丢弃。 示例 对于未封装原生的js来说 let xhr = new XMLHttpRequest(); xhr.open(method,url,true); xhr.onreadystatechange = ()=>{} // 回调函数 xhr.send(); // 发送请求 xhr.abort(); // 请求终端 Axios let cancelToken = axios.CancelTo
ajax异步请求及案例
qq_15994257的博客
08-27 2841
ajax异步请求及案例 1、ajax的介绍 前端页面想和后端页面进行数据交互就可以使用ajax。 让 javascript 发送异步的 http 请求，与后台服务器通信进行数据的获取，实现局部刷新。 在html页面使用ajax需要在web服务器环境下运行, 一般向自己的web服务器发送ajax请求。 2、ajax的使用 jquery将它封装成了一个方法$.ajax()，我们可以直接用这个方法来执行ajax请求。 使用前, 先在 https://www.apishop.net/ 注册账号, 在控制台获得
Ajax异步请求
m0_48844699的博客
10-31 3948
Ajax是一个异步请求,可以不用刷新整个页面，就可以达到局部更新的效果。百度的搜索也用到了ajax这个技术，当我们每次输入一个关键字的时候，搜索栏下面也会跟着改变，但是这个改变并不会刷新整个页面。想必大家也很好奇什么是异步请求，什么是同步请求，那么接下来就有我来进行揭秘吧。
AJAX 异步请求详细教程
qq_54525448的博客
03-04 8570
Ajax 全称为 Asynchronous JavaScript And Xml -- 异步 js 和 xml，用来进行交互式网页的制作；也是一种动态的网页开发技术，在不加载整个页面的前提下进行页面局部内容的刷新；Ajax 在后台与服务器进行少量的数据交互，使用网页实现异步更新，比传统的刷新整个页面带给服务器的压力要小很多；让程序的运行更加顺畅；Ajax 分为原生 js 实现和 Jquery 框架实现；
AJAX 异步请求数据
编程菜鸟
01-04 931
AJAX 的全称是Asynchronous JavaScript and XML，其中，Asynchronous是异步的意思，它有别于传统web开发中采用的同步的方式。 AJAX 使用 JavaScript 在 web 浏览器与 web 服务器之间来发送和接收数据。 通过在幕后与 web 服务器交换数据，而不是每当用户作出改变时重载整个 web 页面，AJAX 技术可以使网页更迅速地响应。(目的：提高用户体验，较少网络数据的传输量) A...
Ajax异步请求的五个步骤
qq_62380657的博客
05-05 9863
AJAX（Asynchronous JavaScript and XML）：是指一种创建交互式网页应用的网页开发技术，通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这就意味着可以在不重新加载整个网页的情况下，对网页的局部进行更新。 1.建立xmlHttpRequest异步对象 const xhr=new XMLHttpRequest(); 2.创建HTTP请求（设置请求方法和URL） //get方式 xhr.open('GET',URL); //post方式发送数据
Ajax异步请求原理
dog_m的博客
05-31 1491
一、Ajax能做什么 异步请求、局部刷新 二、同步请求 JavaScript的特点是单线程，也正是因为单线程造成了同步请求 1. 为什么JS是单线程: JS 作为游览器脚本语言，主要用途是和用户交互、操作 DOM，如果使用多线程，会造成复杂的同步问题，如两个线程同时操作一个 DOM 节点，一个线程在这个节点上添加内容，另一个线程删除了这个节点，应该以哪个线程为准呢？ 为了避免复杂性，所以 JS 采用了单线程模式，即使 HTML5 的新标准里面，允许 JS 创建多个线程，子线程也必须受主线程控制，并且不允许操
JS实现AJAX异步请求
qq_37035987的博客
07-01 658
3、打开通道，XMLHttpRequest对象的open(method,url,async,user,psw)方法，method：请求类型GET或POST，url请求路径，async异步true同步flase，user和psw为帐号和密码，可以不用填写，只有在服务器需要时才能访问的情况下填写。浏览器把请求交给浏览器内置对象XMLHttpRequest，由XMLHttpRequest对象发起，接收，解析服务器响应的数据，并把数据更新到浏览器指定的位置，从而实现页面局部刷新。服务器响应的 JSON格式数据。
ajax异步请求原理
awei19950103的博客
09-27 2083
1.什么是AJAX? AJAX全称为“Asynchronous JavaScript and XML”（异步JavaScript和XML），是一种创建交互式网页应用的网页开发技术。它使用： 使用XHTML+CSS来标准化呈现； 使用XML和XSLT进行数据交换及相关操作； 使用XMLHttpRequest对象与Web服务器进行异步数据通信； 使用Javascript操作Document Object Model进行动态显示及交互； 使用JavaScript绑定和处理所有数据。 2.AJAX的工作原理 Aja
ajax异步请求小结
08-31
**Ajax异步请求小结** Ajax（Asynchronous JavaScript and XML）是一种用于创建快速、动态网页的技术，它允许在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页内容。这种技术极大地提升了用户体验，...
Ajax异步请求技术实例讲解
10-19
Ajax异步请求技术是Web开发中的核心组成部分，它使得网页能够在不刷新整个页面的情况下与服务器进行通信，更新局部内容。这极大地提升了用户体验，特别是在交互频繁的Web应用中。Ajax的全称是Asynchronous ...
jquery的ajax异步请求接收返回json数据实例
12-03
在JavaScript的世界中，jQuery库极大地简化了与服务器端交互的过程，特别是对于异步请求（Ajax）和处理返回的JSON数据。本篇文章将深入探讨如何使用jQuery的`$.ajax`方法来实现异步请求并接收JSON数据。 首先，JSON...
方案-基于云架构的校园信息化建设方案.pdf
最新发布
07-29
方案-基于云架构的校园信息化建设方案.pdf
【创新未发表】Matlab实现蛇群优化算法SO-Kmean-Transformer-LSTM负荷预测算法研究.rar
07-29
1.版本：matlab2014/2019a/2021a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。 5.作者介绍：某大厂资深算法工程师，从事Matlab算法仿真工作10年；擅长智能优化算法、神经网络预测、信号处理、元胞自动机等多种领域的算法仿真实验，更多仿真源码、数据集定制私信+。 替换数据可以直接使用，注释清楚，适合新手
【创新未发表】Matlab实现北方苍鹰优化算法NGO-Kmean-Transformer-LSTM组合状态识别算法研究.rar
07-29
1.版本：matlab2014/2019a/2021a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。 5.作者介绍：某大厂资深算法工程师，从事Matlab算法仿真工作10年；擅长智能优化算法、神经网络预测、信号处理、元胞自动机等多种领域的算法仿真实验，更多仿真源码、数据集定制私信+。 替换数据可以直接使用，注释清楚，适合新手
【创新未发表】Matlab实现蝗虫优化算法GOA-Kmean-Transformer-BiLSTM组合状态识别算法研究.rar
07-29
1.版本：matlab2014/2019a/2021a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。 5.作者介绍：某大厂资深算法工程师，从事Matlab算法仿真工作10年；擅长智能优化算法、神经网络预测、信号处理、元胞自动机等多种领域的算法仿真实验，更多仿真源码、数据集定制私信+。 替换数据可以直接使用，注释清楚，适合新手
【创新未发表】Matlab实现蛇群优化算法SO-Kmean-Transformer-LSTM组合状态识别算法研究.rar
07-29
1.版本：matlab2014/2019a/2021a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。 5.作者介绍：某大厂资深算法工程师，从事Matlab算法仿真工作10年；擅长智能优化算法、神经网络预测、信号处理、元胞自动机等多种领域的算法仿真实验，更多仿真源码、数据集定制私信+。 替换数据可以直接使用，注释清楚，适合新手
用ajax异步请求 ajax异步请求
07-25
当使用Ajax进行异步请求时，你需要创建一个XMLHttpRequest对象，并使用它来发送HTTP请求。以下是一个使用Ajax进行异步请求的示例： ```javascript // 创建XMLHttpRequest对象 var xhr = new XMLHttpRequest(); // 设置请求的方法和URL xhr.open('GET', 'https://api.example.com/data', true); // 设置请求头（可选） xhr.setRequestHeader('Content-Type', 'application/json'); // 监听请求状态的变化 xhr.onreadystatechange = function() { if (xhr.readyState === 4 && xhr.status === 200) { // 请求成功，处理返回的数据 var response = JSON.parse(xhr.responseText); console.log(response); } else if (xhr.readyState === 4 && xhr.status !== 200) { // 请求失败，处理错误信息 console.error('Error:', xhr.status); } }; // 发送请求 xhr.send(); ``` 在这个示例中，我们创建了一个GET请求，并指定了请求的URL。你可以根据你的需求来设置请求方法（GET、POST等）和URL。然后，我们可以通过设置请求头来传递额外的信息。在`onreadystatechange`事件处理程序中，我们检查请求的状态和响应的状态码，根据情况处理返回的数据或错误信息。 请注意，示例中的URL是一个示意的API地址，你需要根据你的实际需求来设置正确的URL。 希望这个示例对你有帮助！如果你还有其他问题，请随时提问。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值