javascript——常用事件总结

Event对象：Event 对象代表事件的状态，比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。

事件标签属性	当以下情况发生时，出现此事件
onabort	图像加载被中断
onchange	用户改变域的内容
onclick	鼠标点击某个对象
ondblclick	鼠标双击某个对象
onerror	当加载文档或图像时发生某个错误
onfocus、onblur	元素获得焦点、失去焦点时触发
onkeydown、onkeyup	某个键盘的键被按下、被松开时触发
onkeypress	某个键盘的键被按下或按住
onload、 onunload	某个页面或图像被完成“加载”、用户退出页面
onmousedown、onmouseup	某个鼠标按键被按下、被松开时触发
onmousemove	鼠标被移动
onmouseout	鼠标从某元素移开
onmouseover	鼠标被移到某元素之上
onresize	窗口或框架被调整尺寸
onselect	文本被选定
onsubmit、onreset	提交按钮、重置按钮被点击

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <script>
            function test(){
                console.log("李银霞");
            }
        </script>
    </head>
    <body>
        <!--
            1：onchange=" "事件
        -->
        <select onchange="test()">
            <option value="1">一年级</option>
            <option value="2">二年级</option>
            <option value="3">三年级</option>
        </select>
        <!--
            2：onclick=" "点击事件
        -->
        <input type="submit" onclick="test()"/>
        <!--
            3:onfocus=" "获取焦点事件
        -->
        <input onfocus="test()" />
        <!--
            4：onblur=" "失去焦点事件
        -->
        <textarea onblur="test()"></textarea>
        <!--
            5:onkeydown=""键盘的某个键被按下时触发的事件
        -->
        <input onkeydown="test()" />
        <!--
            6:onkeyup=""键盘的某个键被松开时触发的事件
        -->
        <textarea onkeyup="test()"></textarea>
        <br />
        <!--
            作者：1767757232@qq.com
            时间：2018-08-21
            描述：
        -->
        <input onkeypress="test" />
        <!--
            8:onmousedowm=""鼠标按下事件
        -->
        <div style="background: red;" onmousedown="test()">
            按钮
        </div>
        <!--
            9:onmouseup=""鼠标松开事件
        -->
        <div style="background: blue;" onmouseup="test()">
            按钮
        </div>
        <!--
            10：onmouseover=""鼠标划上去事件
        -->
        <div style="background: green;" onmouseover="test()">
            按钮
        </div>
        <!--
            11:onmouseout=""鼠标滑开事件
        -->
        <div style="background: purple;" onmouseout="test()">
            按钮
        </div>
        <!--
            12：onmousemove=""滑动鼠标事件
        -->
        <div style="background: black;" onmousemove="test()">
            按钮
        </div>
    </body>
</html>

秒客网

javascript——常用事件总结

相关文章