Uncaught TypeError: Cannot read property ‘readyState‘ of null Ajax前端报错

最新推荐文章于 2024-05-31 17:40:50 发布

SingingMelody

最新推荐文章于 2024-05-31 17:40:50 发布

阅读量4.6k

点赞数

分类专栏：日常报错前端文章标签： Ajax readyState onreadystatechange

本文链接：https://blog.csdn.net/qq_42267135/article/details/91049505

版权

日常报错同时被 2 个专栏收录

7 篇文章 0 订阅

订阅专栏

前端

1 篇文章 0 订阅

订阅专栏

如标题，今天使用Ajax时，因为需求，想给readyState设置一个带参的响应函数，但是在实际使用时，报了标题的那种错，各种百度，都没找到有这个问题的相关解决方法。

但是我另一个项目却能正常使用(readyState对应的是无参函数)ajax.js，于是我就纳闷了，后来想着试试看的心态，把响应函数改为无参的，报错没有了。

后来我又去找怎么给那个响应函数传递一些值(刚刚是通过参数传递)，百度后，也没找到方法。最后突然想到设置全部变量，就可以解决了。报错代码如下

//deleteGoods.js
window.onload = function(){  
	function deleteCheck($ID, goodsID){
		if(confirm("确认删除？")){
			var url="deleteGoods";
			var params="goodsID="+goodsID;
			sendRequest(url, params, "POST", showmsg($ID));//自定义的一个函数，详细见下面的ajax.js文件
		}
	}
    //showmsg带参函数
	function showmsg($ID){
		if(xmlHttpRequest.readyState==4){/报错位置
			if(xmlHttpRequest.status==200){
				var info = xmlHttpRequest.responseText;
				alert(info);
				$("#"+$ID).remove();
			}
		}
	}
	$(".deletebtn").each(function(){
		$(this).click(function(){
			deleteCheck($(this).parent().attr("id"),$(this).parent().attr("value"));
		});
	});
}

//ajax.js
//声明XMLHttpRequest对象
var xmlHttpRequest=null;
//创建XMLHttpRequest对象实例的方法
function createXHR(){
	try{
		xmlHttpRequest=new XMLHttpRequest();
	}catch(e1){
		var _msxmlhttp=new Array("Msxml2.XMLHTTP.6.0","Msxml2.XMLHTTP.5.0",
								"Msxml2.XMLHTTP.4.0","Msxml2.XMLHTTP.3.0",
								"Msxml2.XMLHTTP","MICROSOFT.XMLHTTP",);
		for(var i=0;i<_msxmlhttp.length;i++){
			try{
				xmlHttpRequest=new ActiveXObject(_msxmlhttp[i]);
				if(xmlHttpRequest!=null){break;}
			}catch(e2){}
		}
	}
	if(xmlHttpRequest==null){
		alert("不能创建Ajax对象！");
	}
}
//发送客户端的请求，该方法有4个参数，其中method取值为POST或GET
function sendRequest(url, params, method, handler){
	createXHR();
	if(!xmlHttpRequest) return false;
	xmlHttpRequest.onreadystatechange = handler;	//指定响应函数为handler，报错时这条语句相当于是xmlHttpRequest.onreadystatechange=showmsg($ID);
	if(method == "GET"){
		xmlHttpRequest.open(method, url+"?"+params,true);
		xmlHttpRequest.send(null);
	}else{
		xmlHttpRequest.open(method, url, true);
		xmlHttpRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
		xmlHttpRequest.send(params);
	}
}

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>My JSP 'test.jsp' starting page</title>
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/ajax.js"></script>
  </head>
  <body>
    <div>
    	<div id="1" value="value1">
    		<button value="1" class="deletebtn" style="height: 20px;"></button>
    	</div>
    	<div id="2" value="value2">
    		<button value="2" class="deletebtn" style="height: 20px;"></button>
    	</div>
    	<div id="3" value="value3">
    		<button value="3" class="deletebtn" style="height: 20px;"></button>
    	</div>
    </div>
    
    <script type="text/javascript" src="js/deleteGoods.js"></script>
  </body>
</html>

下面的deleteGoods.js的改进

window.onload = function(){  
	var selectID;//设置了一个全局变量
	function deleteCheck($ID, goodsID){
		if(confirm("确认删除？")){
			var url="deleteGoods";
			var params="goodsID="+goodsID;
			sendRequest(url, params, "POST", showmsg());
		}
	}
    //这里改成定义一个无参函数
	function showmsg(){
		if(xmlHttpRequest.readyState==4){
			if(xmlHttpRequest.status==200){
				var info = xmlHttpRequest.responseText;
				alert(info);
				$(selectID).remove();//在这里使用全局变量
			}
		}
	}
	$(".deletebtn").each(function(){
		$(this).click(function(){
			if(confirm("确认删除？")){
				var url="deleteGoods";
				var params="goodsID="+$(this).parent().attr("value");
				selectID = $(this).parent().attr("id");//用全局变量保存要传的值
				sendRequest(url, params, "POST", showmsg);
			}
		});
	});
}

如有更好建议，欢迎提出。

SingingMelody

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Uncaught TypeError: Cannot read property ‘readyState‘ of null Ajax前端报错

如标题，今天使用Ajax时，因为需求，想给readyState设置一个带参的响应函数，但是在实际使用时，报了标题的那种错，各种百度，都没找到有这个问题的相关解决方法。但是我另一个项目却能正常使用(readyState对应的是无参函数)ajax.js，于是我就纳闷了，后来想着试试看的心态，把响应函数改为无参的，报错没有了。后来我又去找怎么给那个响应函数传递一些值(刚刚是通过参数传递)，百...
复制链接

扫一扫

专栏目录