gpt4 book ai didi

javascript - 如何防止 PHP sleep 函数停止我的 HTML 页面

转载 作者:行者123 更新时间:2023-12-04 15:05:07 25 4
gpt4 key购买 nike

我目前正在尝试编写一个骰子游戏。当用户单击“播放”时,骰子将开始变化。一颗骰子是用户的,一颗是服务器的。发生这种情况时,我的 PHP 页面将等待 5 秒,然后计算一个随机数。然后它会将它发送到 HTML 页面,一旦 HTML 接收到它,它就会停止掷骰子并宣布获胜者。我目前停留在 PHP 部分并尝试使用 sleep 函数。但是,当我执行此操作时,如果我单击“播放”,则骰子在收到数字之前不会移动,然后它会开始洗牌。到目前为止,这是我的代码。

HTML/JS

<body>
<h1>Brandon Wong</h1>
<input type="button" id="play" value="Play">
<div id = "userDie"></div>
<div id = "serverDie"></div>
<script>
document.querySelector('input[type]').addEventListener('click', toss_dice);

//display default dice*/
var userDie = document.createElement('img');
var serverDie = document.createElement('img')
userDie.src = '1.gif';
serverDie.src = '1.gif';
document.getElementById('userDie').appendChild(userDie);
document.getElementById('serverDie').appendChild(serverDie);

function toss_dice() {
var dice = ['1.gif', '2.gif', '3.gif', '4.gif', '5.gif', '6.gif'];
var randPlayer2 = 0;
setInterval(function(){
var randPlayer1 = Math.floor(Math.random() * dice.length);
var randPlayer2 = Math.floor(Math.random() * dice.length);
userDie.src = dice[randPlayer1];
serverDie.src = dice[randPlayer2];
document.getElementById('userDie').appendChild(userDie);
document.getElementById('serverDie').appendChild(serverDie);
//alert(randPlayer1);
}, 500);

request = new XMLHttpRequest();
request.open('GET', 'hw02.php', false);
request.send(null);

var test = request.responseText;
alert(test);
}

</script>

PHP

<?php 
sleep(5);
$number = rand(0,5);
echo $number:
?>

这是一个 link到我的页面可以看到我的页面到目前为止

最佳答案

您的请求当前正在使用 , false 作为阻塞 请求。这将阻止动画和其他 JS 等在请求进行时在页面上运行。同步请求已弃用,可能会导致糟糕的用户体验(如您所见)- 请改用适当的异步请求。

request.addEventListener('readystatechange', () => {
if (request.readyState === 4) {
console.log(request.responseText);
}
});
request.open('GET', 'hw02.php');

关于javascript - 如何防止 PHP sleep 函数停止我的 HTML 页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66299364/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com