原生Ajax

迷南。 2022-04-05 03:56 235阅读 0赞

原生Ajax

<span>输入账号 :</span>  
<input id="name" name="name" οnkeyup="check()" type="text">   
<span id="checkResult"></span>  
    
<script>

第一步：jsp中设置全局变量  
var xmlhttp;  
function check()\{  
  var name = document.getElementById("name").value;  
  var url = "http://how2j.cn/study/checkName.jsp?name="+name;

第二步：实例化XMLHttpRequest  
  xmlhttp =new XMLHttpRequest();

第三步：设置响应函数checkResult，注意checkResult（）错误！：后面不能加括号，加括号表示函数的结果  
  xmlhttp.onreadystatechange=checkResult;

第四部：设置访问的页面  
  xmlhttp.open("GET",url,true);   //设置访问的页面

第五部：执行访问  
  xmlhttp.send(null);  //执行访问  
\}  
    
function checkResult()\{  
  第六部：编写响应函数  
  if (xmlhttp.readyState==4 && xmlhttp.status==200)  
    document.getElementById('checkResult').innerHTML=xmlhttp.responseText;  
     
\}  
</script>

xmlhttp.send(null)  
null表示没有参数，因为参数已经通过“GET" 方式，放在url里了。  
只有在用"POST"，并且需要发送参数的时候，才会使用到send。  
类似这样：  
    在提交之前需要设置请求头  
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");  
xmlhttp.send("user="+username+"&password="+password)

xmlhttp.readyState 4 表示请求已完成  
xmlhttp.status 200 表示响应成功  
xmlhttp.responseText; 用于获取服务端传回来的文本  
服务端传文本不要使用println(),可以使用print();

创建ajax对象有时候需要判定：  
var xmlHttp;  
if(window.ActiveXObject)\{  
    xmlHttp =   
\}else if(window.XMLHttpRequest)\{  
    xmlhttp =new XMLHttpRequest();  
\}

发表评论取消回复

表情：

评论列表（有 0 条评论，235人围观）

还没有评论，来说两句吧...

相关阅读

相关原生AJAX（捕获野生的ajax）

AJAX 不需要刷新页面也能发送请求的技术：AJAX 1、创建AJAX对象： var ajax = new XMLHttpRequest();

悠悠/ 2022年12月24日 10:59/ 0 赞/ 205 阅读

相关原生ajax封装

引入线上jquery： <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

梦里梦外;/ 2022年09月14日 02:25/ 0 赞/ 222 阅读

相关原生ajax实例

var xmlhttp = new XMLHttpRequest(); //创建事件处理程序

悠悠/ 2022年05月31日 05:51/ 0 赞/ 218 阅读

相关 javascript 原生ajax 请求

设置自定义的ajax 的请求,并增加回调方法兼容不同的浏览器 //原生js ajax 请求 function execAjax(url,date,f

╰+哭是因爲堅強的太久メ/ 2022年05月23日 23:50/ 0 赞/ 253 阅读

相关原生JS Ajax请求

传统方法的缺点: 传统的web交互是用户触发一个http请求服务器,然后服务器收到之后,在做出响应到用户,并且返回一个新的页面,每当服务器处理客户端提交的请求时,客户都只能

ゝ一纸荒年。/ 2022年05月11日 09:20/ 0 赞/ 279 阅读

相关原生Ajax post提交

function CreateXmlRequest(){ var xmlHttp=null; if(window.XMLHttpRe

Love The Way You Lie/ 2022年04月16日 03:07/ 0 赞/ 240 阅读

相关原生Ajax

原生Ajax <span>输入账号 :</span> <input id="name" name="name" οnkeyup="check()" type="text"

迷南。/ 2022年04月05日 03:56/ 0 赞/ 236 阅读

相关原生ajax封装

//参数/ url :地址 obj: 参数 callback 回调 //没做容错有时间在写一

深藏阁楼爱情的钟/ 2021年09月16日 23:42/ 0 赞/ 381 阅读

相关原生js 封装ajax

这是自己封装的ajax ，分享一下：直接上代码文件夹 ![70][] index.html ![70 1][] ![70 2][]

不念不忘少年蓝@/ 2021年09月15日 07:50/ 0 赞/ 452 阅读

相关原生js实现ajax

Ajax的原理：简单来说就是通过XmlHttpRequest对象向服务器发异步请求，从服务器获得数据，然后用 javascript 来操作DOM更新页面的技术。一般来

短命女/ 2021年08月13日 20:32/ 0 赞/ 466 阅读