事件

作者: 这世间好折磨人 | 来源:发表于2022-05-26 08:59 被阅读0次

    (1)、鼠标事件:

                        鼠标点击事件(单击): onclick

                        鼠标点击事件(双击): ondbclick

                        鼠标移入事件(不支持冒泡): onmouseenter

                        鼠标移出事件(不支持冒泡): onmouseleave

                        鼠标移入事件(支持冒泡): onmouseover

                        鼠标移出事件(支持冒泡): onmouseout

                        鼠标按下事件(按下时触发): onmousedown

                        鼠标抬起事件(抬起时触发): onmouseup

    (2)、键盘事件:    

                        键盘按下(按下就触发): onkeydown

                        键盘松开(松开就触发): onkeyup

                        键盘按下松开事件: onkeypress

                        讲解键盘事件:

                                key 属性:按键触发时获取按键上的字符 (key 属性在 onkeypress 事件中识别不了功能键)

                                keyCode 属性 : 按键触发时获取与键盘按键上的字符与之对应的 ASCLL 编码(keyCode 属性在onkeydown 事件获取的永远是大写字母对象的ASCLL编码。keyCode 属性在 onkeypress 事件中获取的是与之对应的大小写字母的ASCLL编码)

    (3)、表单事件

                        获取焦点事件(对于一个普通元素来说想要拥有焦点事件,需要添加 tabindex 属性): onfocus

                        失去焦点事件: onblur

                        输入事件(输入框中的值发生改变都会触发): oninput

                        表单元素状态发生改变(一般用于 checkbox 和 select 标签): onchange

                            onchange 事件: 

                                            onchange 事件不运行在普通的文本输入框

                                            当 onchange 属性用在多选框当中时   选中和取消都会触发

                                            当 onchange 属性用在下拉菜单中时   只有值发生改变时才会触发 

    (4)、窗口事件:

                        当网页加载完毕时触发: onload

                        滚动事件(普通事件也有滚动事件但一般都是用于页面滚动): onscroll

    (5)、拖拽事件:

                        开始拖拽时触发: ondragstart

                        正在拖拽时触发: ondrag

                        完成拖拽时触发: ondragend

                        在拖拽过程中,释放鼠标时触发此事件: ondrop

                        当被鼠标拖拽的对象离开其容器范围内时触发: ondragleave

                        拖拽到指定位置: ondragover            默认情况下,执行 ondragover 事件(谷歌浏览器)浏览器不允许进去 drop 事件(就是不允许放下拖拽的元素),因此需要阻止浏览器的默认行为    e.preventDefault();    阻止默认行为

    相关文章

      网友评论

          本文标题:事件

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