您的位置：首页 > Web前端 > JavaScript

韩顺平 javascript教学视频_学习笔记23_js事件驱动机制深入理解_js常用事件_js版计算器

2016-02-22 18:04 1231 查看

js事件可以被多个函数监听

例子如下：

<html>
<head>
<script language="javascript">
function test1(eventObj){

window.alert("OK1");
}
function test2(eventObj){

window.alert("OK2");
}
</script>
</head>
<body >
<input type="button" value="一个事件可以被多个函数监听" onclick="test1(this),test2(this)"/> <!-- 一个事件可以被多个函数监听 -->
</body>
</html>

js事件特别说明：

特别强调一点：并不是所有的html元素都有相同的event事件（对象），这个请大家在做项目的时候特别注意，比如提交按钮有onsubmit事件，但是输入框就没有，具体请大家参考js帮助文档。

window有三个事件：

onload：页面打开

onbeforeunload：页面关闭前

onunload：页面关闭后

综合案例如下：

<html>
<head>
<script language="javascript">
function test1(eventObj){

window.alert("OK1");
}
function test2(eventObj){

window.alert("OK2");
}
function test3(eventObj){

window.alert("输入框被选中");
}
function test4(){

window.alert("onload.....");
//把鼠标定位到text输入框
document.getElementById("text1").onfocus();//这个有问题，后面再讲
}
function test5(){

window.alert("onunload.....");//页面关闭前弹出，这个有问题，后面再讲

}
function test6(){

window.alert("onbeforeunload.....");

}
function test7(){

window.alert("不要点击右键");
return false;

}
function test8(){

window.alert("不能选内容哦");
return false;

}
</script>
</head>
<body onselectstart="return test8()" oncontextmenu="return test7()" onload="test4()" onunload="test5()" onbeforeunload="test6()">
<div>不能拷贝内容哦</div>
<input type="button" value="多个函数监听" onclick="test1(this),test2(this)"/>
<input type="text" id="text1" onfocus="test3(this)"/>
</body>
</html>

oncontextmenu 事件：return false ；就是不能点击右键

onselectstart 事件： return false；就是不能复制页面内容

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： javascript 韩顺平学习视频

相关文章推荐

新的分享

章节导航