最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

(拯救选择困难症)随机选择今天中午吃啥

旗下网站admin38浏览0评论

(拯救选择困难症)随机选择今天中午吃啥

(拯救选择困难症)随机选择今天中午吃啥

不知道今天中午改吃啥

HTML(拯救选择困难症)


效果图:

源代码:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>随机点餐</title>
</head>
<style>
	#box{background-color:#CCC;width:400px;font:600 24px/3 "";text-align:center;margin:20px auto		;border-radius:12px;}
	#btn{background-color:#CFF;width:100px;font:14px/2 "";text-align:center;margin:10px 46%		;border-radius:25px;}
</style>
<body>
    <div id="box">今天中午想点啥</div>
    <input type="button" id="btn" value="开始">
</body>
<script>
 
    var arr = ["椰子鸡","牛肉饭","汤饭","大碗饭", "饺子","糖醋排骨","红烧肉"];
 
    var box = document.getElementById("box")
    var btn = document.getElementById("btn")
 
    var i=0;
    var t;
 
    btn.onclick = function(){
        if(i==0){
            t = setInterval(function(){
                box.innerHTML = arr[random(0,arr.length-1)];
            }, 30);
 
            i = 1;
            btn.value = "停止"
        }else{
            clearInterval(t);
            i = 0;
            btn.value = "继续";
        }
    }
 
 
    function random(a,b){
        return Math.round(Math.random()*(a-b)+b);
    }
 
</script>
</html>
发布评论

评论列表(0)

  1. 暂无评论