Question

我是JSON和AJAX的新手，所以我尝试了这段代码从提到的URL获取JSON数据，然后使用AJAX调用我试图在控制台上打印它，但是没有任何东西在控制台上打印。

请有人纠正我在这里做错了什么，下面是代码片段。

＆＃13;

var req = new XMLHttpRequest();
var btn = document.getElementById("btn");
var display = document.getElementById("display");
req.open("GET", "http://www.filltext.com/?rows=10&id={index}&email={email}&username={username}&password={randomString|5}&pretty=true", true);
btn.addEventListener("click",function(){
req.onreadystatechange = function() {
	 var res = req.responseText;
	 Console.log(res);
};
});
req.send();

＆＃13;

<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<h1>Hello</h1>
<Button id= 'btn'>click me</Button>
<div id = 'display'></div>

<script>"Test.js"</script>

</body>
</html>

＆＃13;

Answer 1

当您在btn事件中设置req.onreadystatechange时，您只需将回调添加到请求中。问题是已经提出了请求。你需要在btn点击时发出请求，然后在btn动作中调用send（）。

控制台，而不是控制台

var req = new XMLHttpRequest();
var btn = document.getElementById("btn");
var display = document.getElementById("display");

req.open("GET", "http://www.filltext.com/?rows=10&id={index}&email={email}&username={username}&password={randomString|5}&pretty=true", true);
req.onreadystatechange = function() {
    var res = req.responseText;
    console.log(res);
};

btn.addEventListener("click",function(){
    req.send();
});

<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<h1>Hello</h1>
<Button id= 'btn'>click me</Button>
<div id = 'display'></div>

<script>"Test.js"</script>

</body>
</html>

Answer 2

你需要更改你的JS代码并将所有内容放在块中，所以看起来不错:)

var btn = document.getElementById("btn");
var display = document.getElementById("display");

btn.addEventListener("click", function() {
    req = new XMLHttpRequest();
    req.open("GET", "http://www.filltext.com/?rows=10&id={index}&email={email}&username={username}&password={randomString|5}&pretty=true", true);
    req.send();
    req.onreadystatechange = function() {
        var res = req.responseText;
        console.log(res);
    };
});

ajax调用中的open方法没有响应

2 个答案: