美文网首页
2019-09-19

2019-09-19

作者: Amuer蘃 | 来源:发表于2019-10-11 11:32 被阅读0次

鼠标事件

box.onclick = function(){}//鼠标单击
box.ondblclick = function(){}//鼠标双击
box.nomousedown =function(){}//鼠标按下
box.nomouseup =function(){}//鼠标抬起
box.nomouseover =function(){}//鼠标移入
box.nomouseout =function(){}//鼠标移出
box.nomouseenter =function(){}//鼠标移入‘不触发冒泡’
box.nomouseleave =function(){}//鼠标移出‘不触发冒泡’
box.nomousemove =function(){}//鼠标在元素内移动时触发

键盘事件

document.body.onkeydown=function(e){var e = e.event||window.event}//键盘按下,按住重复触发
document.body.onkeyup=function(e){var e = e.event||window.event}//键盘抬起触发
document.body.onkeypress=function(e){var e = e.event||window.event}//键盘按住重复触发

倒计时抽奖

  <div class="box">
        <div id="sb"></div>
        <button id="start">点击开始</button>
        <p>剩余<strong id="num"></strong> 次</p>
    </div>
    <script>
        function getLuck() {//封装抽奖函数
            function getId(idname) {//封装获取id的函数
                return document.getElementById(idname)
            }
            var count = 3;//剩余次数
            var sb = getId('sb')
            var st = getId('start')
            var num = getId('num')
            suiji = 0;//从下标0开始
            num.innerHTML = count;//将次数写入页面
            
            var arr = ['张三', '吴老二', '赵八', '孙六', '王五', '李四'];
            st.onclick = function () {//点击开始
                events(arr)
            }
            sb.innerHTML = arr[suiji];//将随机获取的中奖者写入页面
            function events(arr) {//封装一个倒计时抽奖的函数
                if (count > 0) {//当次数大于零时
                    timer = setInterval(function () {
                        st.disabled = true;//点击开始按钮被禁用
                        suiji = Math.floor(Math.random() * arr.length);//从抽奖者中随机获取一个下标
                        sb.innerHTML = arr[suiji];//将中奖者写入页面
                    }, 10)
                    setTimeout(function () {//每三秒启动一次定时器
                            clearInterval(timer);//清空定时器
                            timer = null;
                            arr.splice(suiji, 1)//截取中奖者
                            st.disabled = false;//开始按钮禁用接触
                            console.log(arr)
                    }, 3000)
                } else {//当次数小于等于0时,抽奖不生效,开始按钮被禁用
                    st.disabled = true;
                    return false;
                }
                count--;//抽奖次数递减
                num.innerHTML = count;
            }
            
           
            
        }
        getLuck()
    </script>

相关文章

  • 习得,有用就有用。

    【成长日志】:2019-09-19 星期四 【学习方法】: 雨宝:157累积法; 阳宝:147累积法。 【学习内...

  • 告别你了

    半年前的今天,我们分手了。 2017-11-26——2019-09-19。 现在是2020-03-19。 我们是因...

  • 药物对脑电图的影响

    哪些药物对脑电图有影响? 医学教育网2019-09-19 大号 “哪些药物对脑电图有影响?”相信是备考脑电图学专业...

  • 零零后 锡坤篇

    2019-09-19: 作为一个快要生娃的准妈妈,最近对育儿类的节目是如饥似渴。 今天又被安利了一个不错的节目 《...

  • 阴沉天气下的明媚

    2019-09-19 周四 阴 昨天,办公室里的闲人就喊着要降温。今天早晨起来,并没有感到比昨日更凉。真不好把握出...

  • 一个失业互联网人的内心独白——处女座的处女作

    2019-09-19 晚 离职已经二十多天了,思考了二十多天的人生还是没有明确的方向,到底是聚焦于当下的生活,还是...

  • 2019-09-19

    吴晓梅谈《空降利刃》:七易其稿 只愿耐心等待一朵花开 文 | 卜晚 责编 |火娃 沈伶 做军旅剧,我用最谦卑最崇敬...

  • 2019-09-19

    键盘窸窸窣窣 你的眼神坚定而专注 长长短短的文字 明暗交替的画面 全在你的几个手指之间 但你的心真的在屏幕上吗? ...

  • 2019-09-19

    人生不管遇到什么,都要清醒地认识到你自己是你唯一的救赎。生命不是用来浪费而是为了成就一个更好的你而存在。做你喜...

  • 2019-09-19

    最近的状态越来越差了,长时间的每天熬夜晚睡,睡眠质量又差,精神越来越萎靡了。 最近一段时间加班有点疯狂,整组人几乎...

网友评论

      本文标题:2019-09-19

      本文链接:https://www.haomeiwen.com/subject/xqtxuctx.html