Rumah  >  Artikel  >  hujung hadapan web  >  javascript事件定义,绑定事件和事件驱动中的命令语言

javascript事件定义,绑定事件和事件驱动中的命令语言

php是最好的语言
php是最好的语言asal
2018-08-04 10:38:311791semak imbas

事件

    事件的定义
        当对文档中的元素进行操作的时候或者文档的状态发生改变的时候会产生一个事件
    事件的三要素
        事件源
        事件
        事件处理程序
    准备知识
        document.getElementById
document.getElementsByTagName
        innerHTML
        style
            1.只能对行内样式进行操作
            2.backgroundColor  有横杠的css样式要使用驼峰命名法
    绑定事件
        1.在html标签元素中    onclick='函数名()'
        2.使用元素对象的方式
    事件驱动
        鼠标事件
            onclick  单击事件
            ondblclick 双击事件
            onmouseover 鼠标移入
            onmouseout 鼠标移出
            oncontextmenu 鼠标右击
            onmousedown 鼠标按下
            onmouseup 鼠标抬起
            onmousemove 鼠标移动
                scrollTopt 将内容进行纵向移动
                scrollLeft 将内容进行横向移动
        键盘事件
            onkeydown 键盘按下
                keyCode 获取键盘按下的ASCII的值(不区分大小写)
                ctrlKey 判断键盘ctrl键是否被按下
                altKey 判断键盘alt键是否被按下
                shiftKey 判断shift是否被按下
            onkeypress 按下抬起
                获取键盘按下的ASCII值(区分大小写,不识别系统按键)
            onkeyup 键盘抬起
        表单事件
            onfocus 聚焦
            onblur 失去焦点
                案例 验证用户名
            onsubmit 表单提交事件
            onchange 当值发生改变的时候
            onreset 表单重置
            onselect 文本域的内容被选中的时候触发的时候
        框架事件
            onload 当网页内容加载完成之后
            onerror  文档加载失败的时候
            onscroll 当网页发生滚动的时候
                document.body.scrollTop 获取滚动高度(谷歌)
                document.body.scrollLeft 获取滚动宽度(谷歌)
                document.documentElement.scrollTop 获取滚动高度IE
                兼容
                    // 兼容火狐谷歌IE
        var top = document.body.scrollTop || document.documentElement.scrollTop;
                案例:window.onscroll = function(){
        // 谷歌获取滚动的距离
        // var top = document.body.scrollTop;
        // var left = document.body.scrollLeft;

        // 火狐IE中获取的滚动距离
        // var top = document.documentElement.scrollTop;

        // 兼容火狐谷歌IE
        var top = document.body.scrollTop || document.documentElement.scrollTop;
        alert(top);
    }
    阻止冒泡
        cancelBubble  使用e对象的方式进行阻止
    扩展知识
        onbeforeunload
        当页面要被关闭的时候执行的代码
//这里必须要写成return的形式 不能写alert
    禁止a链接跳转的事件绑定
        点击我试试
        点击我试试
        点击我试试

相关文章:

JavaScript中绑定事件的三种方式及去除绑定

详解js中的绑定事件和解绑事件

Atas ialah kandungan terperinci javascript事件定义,绑定事件和事件驱动中的命令语言. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn