javascript如何使用函数random来实现课堂随机点名方法详解
更新时间：2020年07月28日 16:40:09 作者：正好00
这篇文章主要介绍了javascript如何使用函数random来实现课堂随机点名方法详解，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
如何使用函数random来实现课堂随机点名
1.最初的样子如下
2.点击开始点名，上面一行的文字变成名字，名字在不停的变化，开始点名变成停止点名，如下
3.点击停止点名，上面名字不动，停止点名变成开始点名，如下：李四同学回答老师问题
代码如下
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
#d2{cursor:pointer;}/*让鼠标移到开始点名的时候变成手型*/
</style>
</head>
<body>
<div id="d1">亲，准备好了吗？</div>
<div id="d2" onclick="fun()">开始点名</div><!--触发事件句柄onlick，调用fun函数-->
<script>
var mytime=null;
var d1=document.getElementById("d1");
var d2=document.getElementById("d2");
function fun()
{if(mytime==null)
{d2.innerHTML="停止点名";
show();
}
else {
clearTimeout(mytime);
d2.innerHTML="开始点名";
mytime=null;
}
}
function show()
{var s=["张三","李四","王五","王二","小二"];
var name=Math.floor(Math.random()*10%s.length);//让name在下标0-4之间取得
d1.innerHTML=s[name];
mytime=setTimeout("show()",1);
}
</script>
</body>
</html>
注意：random是Math中的函数，所以要写成Math.random()
到此这篇关于javascript如何使用函数random来实现课堂随机点名方法详解的文章就介绍到这了,更多相关javascript 使用函数random来实现课堂随机点名方法内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
JavaScript判断FileUpload控件上传文件类型
在CS后台代码中获取FileUpload控件上传文件的类型是比较容易的！那么，能否在客户端通过JavaScript脚本判断FileUpload上传文件类型呢？答案是可以的，下面通过一个小例子为大家展示2015-09-09
图片懒加载，往往作为减少首页白屏时间的一个解决方案而出现。本文将通过示例带大家一起探究一下JavaScript是如何实现图片懒加载的，感兴趣的可以了解一下2022-06-06
使用typeof方法，typeof 返回的是字符串,其中就有一个是undefined，下面是示例代码，大家可以看看2014-09-09
这篇文章主要为大家详细介绍了js和jquery实现tab状态栏切换效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-08-08
这篇文章主要介绍了JavaScript获取XML数据的方法,需要的朋友可以参考下2014-03-03
javascript中mouseover、mouseout使用详解
这篇文章主要介绍了javascript中mouseover、mouseout使用详解的相关资料,需要的朋友可以参考下2015-07-07
HTML5中的大部分动画都是通过Canvas实现,因为Canvas就像一块画布,我们可以通过调用脚本在Canvas上绘制任意形状,甚至是制作动画,这篇文章主要给大家介绍了关于用几十行js实现很炫的canvas交互特效的相关资料,需要的朋友可以参考下2021-11-11
这篇文章主要介绍了只有 20 行的 JavaScript 模板引擎,结合实例形式分析了JavaScript 模板引擎实现方法与相关注意事项,需要的朋友可以参考下2020-05-05
因为要做一个日历控件,遇到国家法定节假日,怎么实现此功能呢?这篇文章主要给大家介绍了关于前端判断节假日的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下2024-08-08
这篇文章主要为大家介绍了JS生态系统加速模块解析赋能性能优化探索,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪2024-01-01
最新评论