JavaScript事件

- 事件，就是文档或浏览器窗口中发生的一些特定的交互瞬间

- JavaScript 与 HTML 之间的交互是通过事件实现的。

- 对于 Web 应用来说，有下面这些代表性的事件：单击事件、鼠标移入移出事件、键盘按下/弹起事件等等

 

事件就是用户与浏览器的交互行为

 

 

onclick 鼠标点击某个对象  

ondblclick 鼠标双击某个对象  

onerror 当加载文档或图像时发生某个错误   

onfocus 元素获得焦点  

onblur 元素失去焦点

onkeydown 某个键盘的键被按下  

onkeypress 某个键盘的键被按下或按住  

onkeyup 某个键盘的键被松开

onload 某个页面或图像被完成加载  

onmousedown 某个鼠标按键被按下  

onmousemove 鼠标被移动  

onmouseout 鼠标从某元素移开  

onmouseover 鼠标被移到某元素之上  

onmouseup 某个鼠标按键被松开  

onreset 重置按钮被点击  

onresize 窗口或框架被调整尺寸  

onselect 文本被选定

onsubmit 提交按钮被点击  

onunload 用户退出页面

 

给button按钮绑定事件

var btn=document.getElementById("btn");  首先绑定到按钮

btn.οnclick=function(){                  给他添加点击事件

alert("按钮点击事件");               点击时候弹出提示框

}

 

JavaScript文档的加载

浏览器在加载一个页面时，是按照自上而下的顺序加载的

读取到一行的时候就运行一行，如果将script标签写在上面，

在执行代码时，页面还没有加载

所以我们一般把script写在下面

onload事件会在整个页面加载完成之后触发为window绑定一个onload事件

window.οnlοad=function(){                 为页面添加一个onload事件

var btn=document.getElementById("btn");

console.log(typeof btn);

console.log(btn);

btn.οnclick=function(){

alert("这是一个button按钮");

};

}

window.onload 在页面上只能出现一次，后面的代码会覆盖前面的代码

 

键盘事件：

onkeydown: 键盘被按下事件

- 如果一直按着某个键不松开，则会一直触发该事件

- 当onkeydown事件连续触发时，第一次和第二次之间的间隔时间稍微长一点，其他则会非常快。这是为了防止误操作的发生

onkeyup: 键盘被松开的事件

 

键盘事件一般都会绑定给一些可以获取焦点的对象或则是document

可以通过keyCode来获取按键的编码，

通过它可以判断哪个键被按下

if(event.keyCode==65&&event.shiftKey){        

alert("按键A和shift键同时被按下了")

}

65代表按键a可以通过keyCode来获取按键的编码

Event 对象代表事件的状态，比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态

 

var txt=document.getElementById("txt"); 首先创建绑定一个输入框

txt.οnkeydοwn=function(event){ 添加键盘事件

event=event||window.event; 兼容

console.log(event.keyCode);            在输入框输入要知道键盘的按键返回一个代表数值

 

除了keyCode，事件对象中还提供了几个属性

altKey

ctrlKey

shiftKey

这三个属性分别是用来判断alt cltrl shift是否被按下的

如果被按下了则返回true，否则返回false