鼠标和键盘相关
<script>
function danji(){
alert("单击");
}
function shuangji(){
alert("双击");
}
function shubiaoyidong(dd){
dd.style.width = "400px";
dd.style.height = "400px";
}
function shubiaoyichu(dd){
dd.style.width = "200px";
dd.style.height = "200px";
}
function shubiaoanxia(dd){
console.log("按下了");
}
function shubiaosongkai(dd){
console.log("松开了");
}
function jianpankanxia(inputObj){
console.log(inputObj.name);
}
function jianpantaiqi(inputObj){
console.log(inputObj.type);
}
</script>
<div style="width: 200px;height:200px;border: 2px red solid;" onclick="danji()" ></div>
<div style="width: 200px;height:200px;border: 2px red solid;" ondblclick="shuangji()" ></div>
<div
style="width: 200px;height:200px;border: 2px red solid;"
onmouseover="shubiaoyidong(this)"
onmouseout="shubiaoyichu(this)"
onmousedown="shubiaoanxia(this)"
onmouseup="shubiaosongkai(this)"
></div>
<input type="text" name="ljq"
onkeydown="jianpankanxia(this)"
onkeyup="jianpantaiqi(this)"
>
body和表单相关
<script>
function change(){
alert("弹出窗口");
}
function change1(){
alert("窗口离开触发");
}
function change2(){
console.log("页面滚动触发");
}
function change3(){
console.log("改变页面大小触发");
}
//失去焦点
function change4(inputObj){
console.log(inputObj.value);
}
//获得焦点
function change5(){
console.log("获得焦点")
}
//监听改变事件
function change6() {
console.log("===========")
}
//表单提交
function sub(){
alert();
}
</script>
<body onload="change();" onunload="change1()" onscroll="change2();" onresize="change3()">
<form action="http://www.baidu.com" method="post" onsubmit="sub();">
<input type="text" name="name" onblur="change4(this)"
onfocus="change5();"
onchange="change6()"
/>
<input type="submit" value="提交">
</form>
</body>
事件冒泡
<script>
function div1(){
alert("爸爸!")
}
function div2(e){
alert("儿子!")
e.cancelBubble = true;
}
</script>
<div style="width: 200px;height:200px;background: red;" onclick="div1();">
<div style="width: 100px;height:100px;background: blue;" onclick="div2(event)">
</div>
</div>
<a href="javascript:;" onclick="alert('ssss')">超链接</a>