日本不卡不码高清免费观看,久久国产精品久久w女人spa,黄色aa久久,三上悠亚国产精品一区二区三区

您的位置:首頁技術文章
文章詳情頁

基于JavaScript實現隨機點名器

瀏覽:46日期:2023-06-08 09:14:31

本文實例為大家分享了JavaScript實現隨機點名器的具體代碼,供大家參考,具體內容如下

基于JavaScript實現隨機點名器

HTML代碼:

<body> <h1>點名啦</h1> <div id='did'> <input type='button' value='隨機點名器'><br> <input type='submit' onclick='doClick()' value='開始'> </div></body>

CSS代碼:

<style> * { margin: 0px; padding: 0px; } body { background-color: rgb(255, 249, 249); } h1 { text-align: center; padding-top: 100px; color: rgba(250, 54, 129, 0.562); } #did { position: relative; width: 200px; margin: 60px auto; } #did input:first-child { width: 200px; height: 60px; background-color: rgba(250, 54, 129, 0.562); /* 不要邊框或設邊框為透明 */ border: none; border-radius: 20px; font-size: 25px; color: #fff; box-shadow: 0px 0px 3px 3px rgba(250, 54, 129, 0.158); /* 點擊時邊框消失 */ outline: 0; } #did input:nth-last-child(1) { width: 100px; height: 40px; margin: 40px 50px; background-color: rgba(250, 54, 129, 0.562); border: 1px solid transparent; background-color: rgba(255, 68, 177, 0.432); border-radius: 15px; box-shadow: 0px 0px 2px 2px rgba(250, 54, 129, 0.158); font-size: 17px; color: #333; outline: 0; transition: color 0.2s ease-out; transition: box-shadow 0.2s ease-out; } #did input:nth-last-child(1):hover { color: #fff; cursor: pointer; box-shadow: 0px 0px 4px 4px rgba(250, 54, 129, 0.158); }</style>

JavaScript代碼:

<script> var rollcall = document.getElementById('rollcall-id'); var action = document.getElementById('action-id'); var h1 = document.getElementsByTagName('h1'); //不能用name,用name只會取得一個字符 var allName = ['張柳菲', '高穎影', '趙溫言', '李穎', '鄧辰希', '莫若鄰', '秦橙', '吳筱宇', '趙希', '馬素瀅', '呂沁雅', '羅鴻哲', '夏素蕓', '謝焱之', '曹夢朦', '李允書', '周楓橋', '孫浩', '江雁菁', '楊振凱', '林舒言', '錢妙妙', '郭景', '杜貝貝', '童閔然', '鐘小凌', '韓云韻', '白然之']; //隨機產生一個名字 function stringRandom() { return parseInt(Math.random() * allName.length); } var time = null; var luckName; //開始 function doStart() { if (time == null) { time = setInterval(function () { //獲取隨機點名的值 luckName = allName[stringRandom()]; rollcall.setAttribute('value', luckName); }, 100); } } //停止 function doStop() { if (time != null) { clearInterval(time); time = null; } } //點擊事件 function doClick() { if (action.value == '開始') { //改變樣式 action.style.backgroundColor = '#cecece'; action.style.boxShadow = '0px 0px 2px 2px rgba(100, 100, 100, 0.4)'; action.value = '停止'; h1[0].innerHTML = '點名啦'; //開始隨機點名 doStart(); } else if (action.value == '停止') { action.style.backgroundColor = 'rgba(255, 68, 177, 0.432)'; action.style.boxShadow = '0px 0px 2px 2px rgba(250, 54, 129, 0.158)'; action.value = '開始'; h1[0].innerHTML = '恭喜' + luckName + '同學獲得一次發言機會'; //停止 doStop(); } }</script>

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持好吧啦網。

標簽: JavaScript
相關文章:
日本不卡不码高清免费观看,久久国产精品久久w女人spa,黄色aa久久,三上悠亚国产精品一区二区三区
蜜臀av一区二区在线免费观看| 亚洲精品无播放器在线播放| 97成人在线| 亚洲精品成a人ⅴ香蕉片| 免费观看日韩电影| 蜜臀av性久久久久蜜臀aⅴ流畅 | 日韩欧美久久| 亚洲欧洲日韩精品在线| 婷婷久久免费视频| 日韩成人在线看| 88久久精品| 久久超级碰碰| 91视频精品| 日韩在线欧美| 亚洲天堂黄色| 蜜臀久久久久久久| 亚洲精品大片| 国产欧美成人| 久久精品一区二区国产| 精品丝袜久久| 性感美女一区二区在线观看| 超碰超碰人人人人精品| 久久九九国产| 欧美在线影院| 亚洲精品成人一区| 老牛国内精品亚洲成av人片| 久久久久久婷| 不卡一区综合视频| 一区二区三区四区日韩| 国产剧情一区| 在线一区视频观看| 蜜臀精品一区二区三区在线观看| 日本不卡一区二区| 精品免费av一区二区三区| 日韩精品网站| 亚洲三级av| 国产精品多人| 久久婷婷一区| 日韩一区中文| 岛国av在线网站| 欧美91福利在线观看| 亚洲精品精选| 精品国产乱码久久久久久1区2匹| 99精品综合| 日本亚洲欧洲无免费码在线| 国产a久久精品一区二区三区| 欧美大黑bbbbbbbbb在线| 日本伊人午夜精品| 正在播放日韩精品| 综合亚洲视频| 最新中文字幕在线播放| 99亚洲精品| 国产精成人品2018| 国产精品日本| 国产一区二区三区国产精品| 国产精品嫩草99av在线| 美女视频一区在线观看| 在线一区电影| 久久精品国产福利| 久久亚洲图片| 极品av在线| 日韩av成人高清| 色爱av综合网| 91精品日本| 国产精品97| 精品视频一区二区三区四区五区 | 国产91一区| 日韩av在线播放中文字幕| 日韩欧美一区二区三区在线观看| 蜜桃av一区二区三区电影| 国产精品久久观看| 日韩精品亚洲专区| 国产综合色产| 久久天堂影院| 日韩一区二区三区免费视频| 色婷婷色综合| 日韩va亚洲va欧美va久久| 国产精品88久久久久久| 精品国产欧美日韩| 日本成人中文字幕在线视频| 五月天久久777| 福利在线免费视频| 日韩国产一区二| 亚洲精华国产欧美| av日韩中文| 国产精品视频一区二区三区综合 | 国产精品xxxav免费视频| 美女精品在线观看| 日韩免费福利视频| 麻豆精品99| 日韩欧美另类中文字幕| 99视频一区| 婷婷成人在线| 日韩在线欧美| 精品精品国产三级a∨在线| 日韩亚洲精品在线观看| 影音国产精品| 快播电影网址老女人久久| 精品视频一区二区三区四区五区| 人人精品久久| 中文一区一区三区免费在线观| 激情亚洲影院在线观看| 久久久精品国产**网站| 国产精品sss在线观看av| 日韩av黄色在线| 日本久久二区| 少妇精品久久久一区二区| 一区二区亚洲精品| 激情欧美日韩一区| 国产精品99视频| 老司机精品视频在线播放| 国产探花在线精品| 日韩高清一区二区| 日韩久久99| 亚洲精品影视| 亚洲男人在线| 亚洲免费网址| 在线观看免费一区二区| 美女毛片一区二区三区四区| 少妇精品导航| 国产综合亚洲精品一区二| 亚洲无线一线二线三线区别av| 日本精品影院| 亚洲视频综合| 尹人成人综合网| 亚洲综合二区| 亚洲综合专区| 丝袜美腿高跟呻吟高潮一区| 蜜乳av另类精品一区二区| 免费观看久久久4p| 日韩激情精品| 国产日韩在线观看视频| 国产欧美日韩视频在线| 久久99精品久久久久久园产越南| 国产精品嫩模av在线| 国产精品红桃| 吉吉日韩欧美| 激情综合激情| 久久亚洲欧美| **爰片久久毛片| 久久只有精品| 日韩欧美精品一区| 欧美日韩第一| 亚洲精品少妇| 国产黄色精品| 欧美一区久久久| 欧美成人综合| 视频一区视频二区中文字幕| 亚洲精品伦理| 美女视频黄 久久| 久久男人av资源站| 图片区亚洲欧美小说区| 最新国产精品久久久| 国产视频一区二区在线播放| 久久精品国产久精国产| 欧产日产国产精品视频| 91久久视频| 91精品视频一区二区| 国产一区二区三区久久| 九九综合在线| 亚洲精品一级| 老牛国内精品亚洲成av人片| 久久蜜桃资源一区二区老牛| 六月丁香综合| 国产精品久久久久久妇女| 天堂av在线| 久久99伊人| 国产精品magnet| 999久久久国产精品| 亚洲91在线| 色网在线免费观看| 亚洲欧美日本日韩| 国产精品视频一区二区三区 | 亚洲三级视频| 欧美国产中文高清| 欧美一区二区三区高清视频| 偷拍亚洲精品| 日韩成人三级| 五月激激激综合网色播| a日韩av网址| 日韩一区二区三区精品视频第3页| 加勒比视频一区| 午夜在线精品| 美女高潮久久久| 在线综合亚洲| 国产精久久久| 国产韩日影视精品| 国产精品香蕉| 99日韩精品| 精品国产乱码久久久久久1区2匹 | 午夜日韩av| 欧美精品导航| 久热re这里精品视频在线6| 狠狠久久伊人| 亚洲午夜国产成人| 黄色aa久久| 日韩1区2区日韩1区2区| 亚洲手机视频| 欧美成a人片免费观看久久五月天| 亚洲精品极品少妇16p|