<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
.box{
width:400px;
border:1px solid #999;
position:absolute;
left:50%;
top:50%;
text-align: center;
padding:20px;
/*margin-left:-200px;
margin-top:-150px;*/
-webkit-transform:translate(-50%, -50%);
-moz-transform:translate(-50%, -50%);
-ms-transform:translate(-50%, -50%);
-o-transform:translate(-50%, -50%);
transform:translate(-50%, -50%);
}
.content{
border:1px solid #999;
padding:20px;
font-size:30px;
}
.box button{
font-family: "Microsoft YaHei";
font-size:20px;
margin-top:10px;
width:100%;
border:1px solid #999;
cursor:pointer;
line-height: 40px;
outline:none;
}
</style>
</head>
<body>
<div class="box">
<div class="content" id="content">隨機點名器</div>
<button onclick="gotoRand()" id="btn">開 始</button>
</div>
<script>
//聲明 所有的人名 組成的數(shù)組
var nameList = ['小麗麗', '小艷艷', '小翠翠', '小靜靜', '曹操', '潘金蓮', '西門慶', '馬奶奶', '林叢', '奧巴馬'];
//聲明時間的變量
var timer = null;
//開始 隨機的函數(shù)
function gotoRand(){
//獲取button 元素
var button = document.getElementById('btn');
//判斷 是開始還是結束
if (timer === null) {
//開啟定時
timer = setInterval(getName, 100);
//把button的內容改掉
button.innerHTML = "暫 停";
} else {
//清除定時
clearInterval(timer);
//修改button的內容
button.innerHTML = "開 始";
//把timer賦值為null
timer = null;
}
}
//隨機獲取姓名函數(shù)
function getName(){
//取隨機數(shù)
var index = Math.floor(Math.random() * 10000000 % nameList.length);
//取出姓名放入 div中
document.getElementById('content').innerHTML = nameList[index];
}
</script>
</body>
</html>
js實現(xiàn)隨機點名
最后編輯于 ：
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
- 文/潘曉璐 我一進店門译秦，熙熙樓的掌柜王于貴愁眉苦臉地迎上來，“玉大人击碗，你說我怎么就攤上這事筑悴。” “怎么了延都？”我有些...
- 正文 為了忘掉前任殊者，我火速辦了婚禮与境，結果婚禮上，老公的妹妹穿的比我還像新娘猖吴。我一直安慰自己摔刁，他們只是感情好，可當我...
- 文/花漫 我一把揭開白布海蔽。 她就那樣靜靜地躺著共屈，像睡著了一般绑谣。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上拗引，一...
- 文/蒼蘭香墨 我猛地睜開眼，長吁一口氣：“原來是場噩夢啊……” “哼断部！你這毒婦竟也來了猎贴？” 一聲冷哼從身側響起，我...
- 正文 年R本政府宣布，位于F島的核電站乳蛾，受9級特大地震影響暗赶，放射性物質發(fā)生泄漏。R本人自食惡果不足惜肃叶，卻給世界環(huán)境...
- 文/蒙蒙 一蹂随、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧因惭，春花似錦岳锁、人聲如沸。這莊子的主人今日做“春日...
- 文/蒼蘭香墨 我抬頭看了看天上的太陽咳燕。三九已至，卻和暖如春乒躺，著一層夾襖步出監(jiān)牢的瞬間迟郎，已是汗流浹背。 一陣腳步聲響...
推薦閱讀更多精彩內容
- 之前有個客戶咨詢我蜕衡，因為他們公司的業(yè)務員有多個人，但公司網站的聯(lián)系方式板塊里只夠放一個人的信息设拟，所以就想能不能實現(xiàn)...
- function getRandomFromTwoNumber(start,end){ var result = ...
