事件处理过程
1一、事件源: 任何一个HTML元素(节点) body, div , button p, a, h1 .......
2二、事件: 你的操作
3 鼠标:
4 * click 单击
5 dblclick 双击
6 contextmenu (在body) 文本菜单(鼠标右键使用)
7 要想屏蔽鼠标右键使用return false
8 window.document.oncontextmenu=function(ent){...}
9
10 * mouseover 放上(移入)
11 * mouseout 离开(移出)
12 mousedown 按下
13 mouseup 抬起
14 * mousemove 移动
15 键盘:
16 keypress 键盘事件
17 keydown 按下
18
19 文档:(主要使用在body标签中)
20 * load 加载
21 unload 关闭(为了兼容可使用下面函数)
22 beforeunload 关闭之前
23
24 表单:
25 * focus 焦点
26 * blur 失去焦点
27 * submit 提交事件
28 * change 改变(如下拉框选择事件)
29 其它:
30 * scroll 滚动事件(常用延迟加载、瀑布流技术)
31 window.onscroll=function(){
32 document.documentElement.scrollTop;//获取滚动条的上距离
33 document.documentElement.scrollLeft;//滚动条的左距离
34 }
35
36 selectd 事件
37
38 。。。。
39
40三、事件处理程序
41 使用一个匿名或回调函数
三种方法加事件
1第一种:
2 格式: <tag on事件="事件处理程序" />
3*第二种:
4 <script>
5 对象.on事件=事件处理程序
6 </script>
7第三种:(火狐不兼容)
8 <script for="事件源ID" event="on事件">事件处理程序</script>
事件对象
1属性:
2 1. srcElement
3 2. keyCode 键盘值
4
5事件 event window.event
6
7 1. srcElement 代表事件源对象
8 2. keyCode 事件发生时的键盘码 keypress , keydown keyup
9 3. clientX, clientY 坐标位置
10 4. screenX, screenY
11 5. returnValue
12 6. cancelBubble;
13
14//为页面添加鼠标右点击事件
15window.document.oncontextmenu=function(ent){
16 //兼容IE和火狐浏览器兼容
17 var event=ent || window.event;
18 //获取事件坐标位置
19 var x=event.clientX;
20 var y=event.clientY;
21 ...
22}
23
24document.getElementById("one").offsetHeight; //获取one对应对象的高度
25 obj.offsetTop 指 obj 距离上方或上层控件的位置,整型,单位像素。
26 obj.offsetLeft 指 obj 距离左方或上层控件的位置,整型,单位像素。
27 obj.offsetWidth 指 obj 控件自身的宽度,整型,单位像素。
28 obj.offsetHeight 指 obj 控件自身的高度,整型,单位像素。
29
30document.all ? 'IE' : 'others':在IE下document.all值为1,而其他浏览器下的值为0;
推荐阅读--
Python 只用一行代码,可以实现哪些事儿?
当pandas撞上了sql,于是一个强大的pandasql库产生了!
牛了!Python最容易入的10个坑!
球分享
球点赞
球在看