选号器(随机选人)

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <title>随机选号器</title>
  <link rel="stylesheet" href="1.css" type="text/css"/>

</head>
<body>

<div>
  <form>
    <input type="text" class="text1" value="天选三子" id="myText"/><br />
    <input type="button" class="text2" value="开始" onclick="startText()"/>
    <input type="button" class="text3" value="停止" onclick="stopText()"/>	<!--onclick事件会在元素被点击时发生-->
  </form>
</div>

<script type="text/javascript" src="1.js"></script>
</body>
</html>

.text1{
    
    		/*文本框*/
    background: green;
    height: 200px;
    width: 1500px;
    font-size: 140px;
    color: #095ae8;/*文字*/
    border: 5px dashed rgba(9, 246, 238, 0.55);	/*设置所有边框属性。*/
    border-radius: 10px;	/*给元素设置圆角边框*/
    text-align: center;
}
.text2{
    
    
    background: green;
    position:relative;	/*relative是相对定位，是相对于前面的容器定位的。*/
    top: 40px;
    left: -90px;
    height: 40px;
    width: 100px;
}
.text3{
    
    
    background: red;
    position: relative;
    top: 40px;
    left: 90px;
    height: 40px;
    width: 100px;
}

div{
    
    
    text-align: center;
}

var timer;
//开始
function startText(){
    
    
    var num1 = Math.floor(Math.random()*15); //随机产生0到14的数
    var num2 = Math.floor(Math.random()*15);
    while(num1==num2) {
    
    
         num2 = Math.floor(Math.random()*15);
    }
    var num3 = Math.floor(Math.random()*15);
    while(num1 == num3 || num1 == num2){
    
    
         num3 = Math.floor(Math.random()*15);
    }
    var str = new Array(
        '刘依鸣', '郭宇琨',
        '陈浩然', '朱晨磊',
        '任颖', '赵紫硕', '刘鑫龙',
        '司文智', '南秋磊', '马鉴',
        '葛亚哲', '雷硕', '崔留洋',
        '宋怡煌', '滕心雨',
    );
    var Str = new Array(
        str[num1] + "  " + str[num2] + "  " + str[num3]
    );
        document.getElementById("myText").value = Str;
        timer = setTimeout("startText()",60);	//定时器函数，递归调用
}
//暂停
function stopText(){
    
    
    clearTimeout(timer);	//清除创建的定时器
}

选号器(随机选人)

猜你喜欢