一个事件源可以有多个事件监听者。
实例代码如下:
<title>lesson40.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script language="javascript" type="text/javascript">
function test5(e)
{
document.write('oh,test5');
document.write('</br>');
}
function test4(e)
{
alert('ok,test4');
}
</script>
</head>
<body>
<div id="div1" class="style1">div1</div>
<!--//点击按钮将传递给两个函数来处理。先调用test4,再调用test5 -->
<input type="button" value="黑色" οnclick="test4(this),test5(this)"/>
</body>
运行结果:
先抵用test4,再调用test5
不同的元素又不同的事件类型:
各种事件的演示:
<head>
<title>lesson40.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script language="javascript" type="text/javascript">
function test5(e)
{
document.write('oh,test5');
document.write('</br>');
}
function test4(e)
{
alert('ok,test4');
}
//当点击按钮或者输入框的时候,onfocus事件被激发。
function test6()
{
window.alert("输入控被选择。");
}
function test7()
{
//当页面加载的时候把鼠标定位到text输入框
document.getElementById("text1").onfocus();
}
function test8()
{
alert("关闭页面。");
}
function test9()
{
alert("你真的要关闭页面页面。");
}
</script>
</head>
<body οnlοad="test7()" οnunlοad="test8()" οnbefοreunlοad="test9()">
<div id="div1" class="style1">div1</div>
<!--//点击按钮将传递给两个函数来处理。先调用test4,再调用test5 -->
<input type="button" value="黑色" οnclick="test4(this),test5(this)"/>
<input type="text" id="text1" οnfοcus="test6()" />
</body>
案列:防止用户通过点击鼠标右键菜单拷贝网页,当用户试图选中网页拷贝文字时,提示版权所有,禁止拷贝。
事件类型是oncontextmelu,不能用右键选择
onselectstart不能拷贝。
<head>
<title>lesson40.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script language="javascript" type="text/javascript">
function test5(e)
{
document.write('oh,test5');
document.write('</br>');
}
function test4(e)
{
alert('ok,test4');
}
//当点击按钮或者输入框的时候,onfocus事件被激发。
function test6()
{
window.alert("输入控被选择。");
}
function test7()
{
//当页面加载的时候把鼠标定位到text输入框
document.getElementById("text1").onfocus();
}
function test8()
{
alert("关闭页面。");
}
function test9()
{
alert("你真的要关闭页面页面。");
}
function test10()
{
alert("别点右键");
return false;
}
function test10()
{
alert("不允许选择文字");
return false;
}
</script>
</head>
<body οnlοad="test7()" onselectstart="return test11()" οncοntextmenu="return test10()" οnunlοad="test8()" οnbefοreunlοad="test9()">
<div id="div1" class="style1">div1</div>
<!--//点击按钮将传递给两个函数来处理。先调用test4,再调用test5 -->
<input type="button" value="黑色" οnclick="test4(this),test5(this)"/>
<input type="text" id="text1" οnfοcus="test6()" />
</body>