常见的事件,onclick,焦点事件onblur,加载事件onload,键盘事件,鼠标事件,表单事件onsubmit

最新推荐文章于 2024-04-20 15:25:58 发布

zhangsan3333

最新推荐文章于 2024-04-20 15:25:58 发布

阅读量330

点赞数

文章标签： javascript

aaa

本文链接：https://blog.csdn.net/djydjy3333/article/details/131710884

版权

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>常见事件</title>

    <script>
        /*


        常见的事件：
            1. 点击事件：
                1. onclick：单击事件
                2. ondblclick：双击事件
            2. 焦点事件
                1. onblur：失去焦点。
                    * 一般用于表单验证
                2. onfocus:元素获得焦点。

            3. 加载事件：
                1. onload：一张页面或一幅图像完成加载。

            4. 鼠标事件：
                1. onmousedown	鼠标按钮被按下。
                    * 定义方法时，定义一个形参，接受event对象。
                    * event对象的button属性可以获取鼠标按钮键被点击了。
                2. onmouseup	鼠标按键被松开。
                3. onmousemove	鼠标被移动。
                4. onmouseover	鼠标移到某元素之上。
                5. onmouseout	鼠标从某元素移开。


            5. 键盘事件：
                1. onkeydown	某个键盘按键被按下。
                2. onkeyup		某个键盘按键被松开。
                3. onkeypress	某个键盘按键被按下并松开。

            6. 选择和改变
                1. onchange	域的内容被改变。
                2. onselect	文本被选中。

            7. 表单事件：
                1. onsubmit	确认按钮被点击。
                    * 可以阻止表单的提交
                        * 方法返回false则表单被阻止提交。
                2. onreset	重置按钮被点击。
         */





        //2.加载完成事件  onload
        window.onload = function(){
            /*//1.失去焦点事件
            document.getElementById("username").onblur = function(){
                alert("失去焦点了...");
            }*/
            /*//3.绑定鼠标移动到元素之上事件
            document.getElementById("username").onmouseover = function(){
                alert("鼠标来了....");
            }*/

            /* //3.绑定鼠标点击事件
             document.getElementById("username").onmousedown = function(event){
                // alert("鼠标点击了....");
                 alert(event.button);
             }*/

            /*  document.getElementById("username").onkeydown = function(event){
                  // alert("鼠标点击了....");
                 // alert(event.button);
                  if(event.keyCode == 13){
                      alert("提交表单");
                  }

              }*/

            /* document.getElementById("username").onchange = function(event){

                 alert("改变了...")

             }

             document.getElementById("city").onchange = function(event){

                 alert("改变了...")

             }*/

            /*document.getElementById("form").onsubmit = function(){
                //校验用户名格式是否正确
                var flag = false;


                return flag;
            }*/
        }

        function checkForm(){
            return false;
        }


    </script>

</head>
<body>

<!--
    function fun(){
       return  checkForm();
    }

 -->


//οnclick="checkForm();则不行
<form action="#" id="form" onclick="return  checkForm();">
    <input name="username" id="username">

    <select id="city">
        <option>--请选择--</option>
        <option>北京</option>
        <option>上海</option>
        <option>西安</option>
    </select>
    <input type="submit" value="提交">
</form>
</body>
</html>

zhangsan3333

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
常见的事件,onclick,焦点事件onblur,加载事件onload,键盘事件,鼠标事件,表单事件onsubmit

常见的事件,onclick,焦点事件onblur,加载事件onload,键盘事件,鼠标事件,表单事件onsubmit
复制链接

扫一扫