logo标签列表

在HTML中创建一个随机数生成器

javascriptphpjqueryhtml
4

我正在尝试创建一个看起来像健康监测器的网页，我需要创建一个随机数生成器，它将充当心率监测器。以下是我的代码：

<?php

function functionName()
{
    return rand(5, 15);
}

?>

<html>
<body>

<?php 

    $i = 0;

while ($i <= 10) 
{
    echo functionName();
    echo "</br>";
    $i++;
}

?>


</body>
</html>

问题是数字一个接一个地打印出来，我需要它们只显示在同一位置但是不同。换句话说，如果我有一个部分说“每秒心跳最好：”，我需要一个新的数字每隔几秒钟显示在那里以代替其他数字。
有人知道如何做到这一点吗？我看过类似的东西，所以我相信这是可行的。
3
你打上了 JavaScript 的标签，所以试一试吧。看看 setInterval 函数。 - rjdown
由于您标记了jquery，因此可以在客户端混合使用jQuery.get和setTimeout，并在服务器端作为响应添加简单的<?php echo functionName(); ?>。 - user1180790
用PHP做这件事没有意义。只需在JS中设置一个计时器，输出一个随机数并将其设置为HTML标签即可。 - Waxi
你可以尝试使用Node.JS将JavaScript代码作为cron作业在服务器上运行。Cron是基于时间的作业调度程序。 - Rahul
3个回答
3

setInterval(function() {
  var i = Math.floor(Math.random() * (15 - 5 + 1)) + 5;
  document.getElementById("random").innerHTML = i;
}, 1000);
 <span id="random"></span>

这也许可以实现？使用 Math.random(); 和 setInterval()

@FortunaIwasaki，如果你想摆脱PHP，你应该使用这个。 - user3785693
@Amin Gharavi 为什么不使用 var i = Math.floor(Math.random() * 15) + 1;？ - Roberto Sepúlveda Bravo
@RobertoSepúlvedaBravo 的'Math.random（）'可以让您获得一个介于0到1之间但不包括1的数字，因此您的数字始终小于1。假设您的数字为0，则var的结果为（0*15）+1，即1。 - Amin Gharavi
@AminGharavi 但我已经用 Math.floor(Math.random() * 15) + 1; 测试了你的代码，它可以正常工作，返回随机数字而不仅仅是数字1。 - Roberto Sepúlveda Bravo
0

你可以使用 Math.random() 生成随机数。

使用 Math.floor() 将数字向下舍入到最近的整数。

并使用 setInterval() 在特定间隔运行函数。

setInterval(function() {
  var i = Math.floor(Math.random() * (15 - 5 + 1)) + 5;
  document.getElementById("hbeat").innerHTML = 'Heart Beat Per Seconds : ' + i;
}, 1000);
<span id="hbeat"></span>

如果你看一下 PHP 代码，它使用了 rand(5, 15)。rand 函数返回一个介于 5 和 15 之间的随机整数，这就是为什么我使用了 Math.floor(Math.random() * (15 - 5 + 1)) + 5;。 - Amin Gharavi
0
为了实现你想要的功能，你可能需要结合使用JavaScript的JQuery和PHP。首先，创建一个名为randomnumber.php的文件。
<?php
die(rand(5,15));
?>

而且，在你的index.php文件中

<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script> <!-- load JQuery from Google CDN -->
    </head>
    <body>
        <h2 id="randomNumber"></h2>
    </body>
    <script>
    function getRandom() {
        setInterval(function() {
            $("#randomNumber").load("randomNumber.php");
        }, 3000) // delay in milliseconds
    }
    getRandom();
    </script>
</html>
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接