JavaScript事件 Events
编辑时间:2019-03-09 14:34:36 作者:666666

JavaScript 事件 Events

A. 事件

描述: 事件,其实就是浏览器捕捉用户的行为操作

    用户单双击,按下键盘,关闭浏览器等,都是用户的行为操作。
    当用户点击某个按钮,意思就是用户在该元素上触发了点击事件。

B. 如何绑定事件?

1. 在元素上添加事件属性
    绑定点击事件:
        <button onclick="">点击</button>

2. 找对象的方式
    绑定点击事件:
        var test = document.getElementById('test');
        test.onclick = function(){};

C. 有哪些事件?

文档事件,图片事件,鼠标事件,键盘事件,表单事件,其他事件...

D. 文档事件

1. onload: 文档加载成功
    回顾:JS执行顺序
        window.onload
    问题:window.onload 重复出现?

    * 所有JS代码都必须写 window.onload 中

E. 图片事件

1. onload
    加载成功
2. onerror
    加载错误

F. 鼠标事件 1~7 可以绑定在任何元素上

1. onclick          单击
2. ondblclick       双击

3. onmousedown      按下
4. onmouseup        弹起

5. onmousemove      鼠标移动

6. onmouseover      经过
7. onmouseout       离开


8. oncontextmenu    在用户点击鼠标右键打开菜单时触发

G. 事件对象是什么鬼?

描述: 事件对象是用于记录鼠标或键盘的状态信息
作用:
    1. 你点击时鼠标的位置?
    2. 按键时,具体按的哪个键?
重要:
    * 事件对象是随着事件产生的

H. 如何获取事件对象?

event
    事件对象

IE下的事件对象
    window.event

I. 事件对象的相关属性(鼠标 / 键盘)

1. event.clientX, event.clientY
    返回当事件被触发时,鼠标指针的水平坐标和垂直坐标

2. event.keyCode
    键盘编码

3. 事件冒泡
    1. event.cancelBubble
        阻止事件冒泡(IE支持, 不符合W3C标准)
    2. event.stopPropagation()  
        * 标准 Event 方法
        不再派发事件。阻止事件冒泡(符合W3C标准)


4. 阻止默认行为
    event.preventDefault()  通知浏览器不要执行与事件关联的默认动作。

5. 其他特定需求的事件对象属性:
    1. event.altKey
        返回当事件被触发时,"ALT" 是否被按下。
    2. event.ctrlKey
        返回当事件被触发时,"CTRL" 键是否被按下。
    3. event.shiftKey
        返回当事件被触发时,"SHIFT" 键是否被按下。

J. 键盘事件

1. onkeydown    按下
2. onkeyup      弹起
3. onkeypress   按一次

4. 案例:

K. 其它事件

1. onscroll     滚动事件
    1. 为DOM对象绑定
        element.onscroll
    2. 为浏览器绑定
        window.onscroll

2. onresize     调整窗口大小

L. 表单事件

1. onblur       元素失去焦点时触发
2. onfocus      元素获取焦点时触发

3. oninput      元素获取用户输入时触发
    注意:IE8不兼容
    实例:实时统计字符数量

4. onchange
    该事件在表单元素的内容改变时触发( <input>,<select>, 和 <textarea>)

5. onsubmit     表单提交
6. onreset      表单重置
    注意:
        onsubmit 、 onreset 是为表单绑定的,而不是某个按钮

    <!--  -->

 点赞 0
 收藏 0
 分享
来说两句吧
最新评论
    暂无评论
天气预报
万年历
2015年
7月
返回今天

博客声明

本博客属个人所有,不涉及商业目的。遵守中华人民共和国法律法规、中华民族基本道德和基本网络道德规范,尊重有节制的言论自由和意识形态自由,反对激进、破坏、低俗、广告、投机等不负责任的言行。所有转载的文撰写页面章、图片仅用于说明性目的,被要求或认为适当时,将标注署名与来源。避免转载有明确“不予转载”声明的作品。若不愿某一作品被转用,请及时通知本人。对于无版权或自由版权作品,本博客有权进行修改和传播,一旦涉及实质性修改,本博客将对修改后的作品享有相当的版权。二次转载者请再次确认原作者所给予的权力范围。

本博客所有原创作品,包括文字、资料、图片、网页格式,转载时请标注作者与来源。非经允许,不得用于赢利目的。本博客受中国知识产权、互联网法规和知识共享条例保护和保障,任何人不得进行旨在破坏或牟取私利的行为。本博客声明以简体中文版为准,不对其他语言版本负责。

如有侵权请及时联系我进行处理。邮箱youseeim666@163.com

友情链接