javascript - 你如何随机化某些数字?

标签 javascript html css

<分区>

我知道如何随机化 1 到 100 之类的数字,但不知道如何随机化某些数字。就像我只想要 1、15 等。我环顾四周,它太困惑了。有更简单的方法吗?谢谢!

function getRandom() {
return Math.random()1, 15, 30, 45;
}

所有代码(它有一个动画,我想要一个随机(特定)数字出现在动画之后的框中

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<!DOCTYPE html>
<html>
<head></head>
<title>The Wheel!</title>
<body bgcolor="orange">
<head>
    <style>
        .wheel {
            width: 200px;
            height: 100px;
            left: 600px;
            top: 300px;
            background: green;
            position: relative;
        }

        .animated-wheel {
            -webkit-animation: myfirst4s 2;
            -webkit-animation-direction: alternate;
            animation: myfirst 4s 2;
            animation-direction: alternate;
        }

        @-webkit-keyframes myfirst {
            0% {background: green; left: 600px; top: 300px;}
            33% {background: black; left: 600px; top: 0px;}
            66% {background: red; left: 600px; top: 650px;}
            100% {background: black; left: 600px; top: 0px;}
        }

        @keyframes myfirst {
            0% {background: green; left: 600px; top: 300px;}
            33% {background: green; left: 600px; top: 300px;}
            66% {background: black; left: 600px; top: 0px;}
            100% {background: red; left: 600px; top: 650px;}
        }
    </style>      
</head>
    <div class="wheel"></div>
    <button onclick="startbtn()">Start</button>
    <button onclick="refresh()">Reset</button>
    <button onclick="getRandom()">Number</button>
    <p id="getRandom()"></p>

<script>
startbtn = function() {
$('.wheel').addClass('animated-wheel');
}
function refresh() {
    location.reload();
};
function getRandom() {
var values = [1, 15, 30, 45];
return values[Math.floor(Math.random() * values.length)];
}
</script>


</body>
</html>

最佳答案

您可以移动数组中的数字并返回具有随机索引的选择。

为了在动画之后获取一个值,您可以使用超时延迟数字的绘制,然后将该值添加到标签中。

function startbtn () {
    $('.wheel').addClass('animated-wheel');
    setTimeout(() => document.getElementById('random').innerHTML = getRandom(), 8000);
}

function refresh() {
    location.reload();
}

function getRandom() {
    var values = [1, 15, 30, 45];
    return values[Math.floor(Math.random() * values.length)];
}
.wheel { width: 200px; height: 100px; left: 600px; top: 300px; background: green;  position: relative; }
.animated-wheel { -webkit-animation: myfirst4s 2; -webkit-animation-direction: alternate; animation: myfirst 4s 2; animation-direction: alternate; }
@-webkit-keyframes myfirst { 0% { background: green; left: 600px; top: 300px; } 33% { background: black; left: 600px; top: 0px; } 66% { background: red; left: 600px; top: 650px; } 100% { background: black; left: 600px; top: 0px; } }
@keyframes myfirst { 0% { background: green; left: 600px; top: 300px; } 33% { background: green; left: 600px; top: 300px; } 66% { background: black; left: 600px; top: 0px; } 100% { background: red; left: 600px; top: 650px; } }
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<body bgcolor="orange">
    <div class="wheel"></div>
    <button onclick="startbtn()">Start</button>
    <button onclick="refresh()">Reset</button>
    <button onclick="getRandom()">Number</button>
    <p id="random"></p>
</body>

关于javascript - 你如何随机化某些数字?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55200083/

上一篇:html - 文本输入之间的垂直线

下一篇:javascript - 想要在单击 html 时显示特定的 div

相关文章:

javascript - 如何访问javascript中的文档

javascript - 未定义数据的语义 UI + React 问题

javascript - 流体模板: passing a javascript varible as the argument value?

javascript - 鼠标悬停事件不会在 IE9 上针对子元素进行细化,事件不会在 IE8 上启动

html - 格式化 HTML 列表以添加可变大小的空间

javascript - 从 Django 模型获取数据到 Google Charts

html - <img> 如何缩放到 sibling 的高度?

javascript - 从另一个页面抓取 HTML

javascript - 向下滚动显示标题并在向上滚动时隐藏

javascript - 如何在 javascript 中为 html 样式添加描边?