[英]Get text from PHP echo and update DIV using AJAX
I'm learning HTML, PHP, AJAX and jQuery in my degree. 我正在学习HTML,PHP,AJAX和jQuery。 In a practise I need to refresh a DIV container every 3 seconds without recharging the whole page.
在练习中,我需要每3秒刷新一个DIV容器,而不需要为整个页面充电。
I must use AJAX to refresh and the response need to be a random number generated in the server using PHP. 我必须使用AJAX进行刷新,响应需要是使用PHP在服务器中生成的随机数。
I have this: 我有这个:
index.php 的index.php
<div id="contador">NEED TO OVERWRITE THIS TEXT</div>
number.php number.php
<?php
echo "Number: " . rand(1,100);
?>
ajaxreload.js ajaxreload.js
function update() {
$("#contador").load('Loading...');
$.ajax({
type: 'GET',
url: 'number.php',
timeout: 3000,
success: function(data) {
$("#contador").html(data);
$("#contador").html('');
window.setTimeout(update, 3000);
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
$("#contador").html('Timeout...');
window.setTimeout(update, 3000);
}
});
}
$(document).ready(function() {
update();
});
The DIV is being updated each 3 seconds, but it isn't getting the echo response from number.php. DIV每3秒更新一次,但没有得到number.php的回应响应。 I'm getting a very fast "Loading..." message and then "Timeout...".
我收到一个非常快的“正在加载...”消息,然后是“超时......”。 What is wrong?
怎么了? I need to use another thing instead of echo?
我需要使用另一种东西而不是回声? Another type or URL data?
另一种类型或URL数据? Another AJAX function?
另一个AJAX功能?
Thank you! 谢谢!
SOLVED : Thank you! 解决 :谢谢! Solved in the console :) The problem is that my index.php file are in the root and the number.php and ajaxreload.js in a "scripts" folder.
解决方案在控制台:)问题是我的index.php文件在根目录中,number.php和ajaxreload.js在“scripts”文件夹中。 The parameter url: 'number.php' try to load it from the div location (where index.php is) and not where script file is calling
参数url:'number.php'尝试从div位置(index.php所在的位置)加载它而不是脚本文件调用的位置
Thank you @dan08 @Keith Chason It was the first time I use the console 谢谢@ dan08 @Keith Chason这是我第一次使用控制台
I don't have an environment in which to test this right now, but my suspicion is that the window.setTimeout(update, 3000);
我现在没有一个可以测试它的环境,但我怀疑是
window.setTimeout(update, 3000);
is not what you're meaning to do. 不是你的意思。
The timeout
parameter of the $.ajax
function is the amount of permitted time for the request, not the interval in which it runs. $.ajax
函数的timeout
参数是请求的允许时间量,而不是它运行的时间间隔。
http://www.tutorialsteacher.com/jquery/jquery-ajax-method http://www.tutorialsteacher.com/jquery/jquery-ajax-method
If you're trying to have it load every 3 seconds, I'd do use the setInterval
function in Javascript: 如果你试图每3秒加载一次,我会在Javascript中使用
setInterval
函数:
https://www.w3schools.com/jsref/met_win_setinterval.asp https://www.w3schools.com/jsref/met_win_setinterval.asp
function update() {
$("#contador").load('Loading...');
$.ajax({
type: 'GET',
url: 'number.php',
success: function(data) {
$("#contador").html(data);
//$("#contador").html(''); This clears your <div>
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
$("#contador").html('Timeout...');
console.log('TextStatus: '+textStatus);
console.log('ErrorThrown: ' + errorThrown);
}
});
}
$(document).ready(function() {
setInterval(update, 3000);
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.