Javascript 事件对象(六)事件默认行为

事件默认行为:

阻止默认事件
普通写法:return false;
屏蔽右键菜单 :  oncontextmenu

 <!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script>
/*
事件默认行为:当一个事件发生的时候浏览器自己会默认做的事情
怎么阻止?
当前这个行为是什么事件触发的,然后在这个事件的处理函数中使用return false;
*/ document.onkeydown = function() { return false; } //oncontextmenu : 右键菜单事件,当右键菜单(环境菜单)显示出来的时候触发 document.oncontextmenu = function() { //alert(1) return false; }
</script>
</head> <body style="height: 2000px;">
</body>
</html>

事件默认行为实例:(自定义右键菜单)

 <!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<style>
#div1 {width:100px; height: 200px; border: 1px solid red; position: absolute; display: none;}
</style>
<script>
window.onload = function() { var oDiv = document.getElementById('div1'); document.oncontextmenu = function(ev) {
var ev = ev || event; oDiv.style.display = 'block'; oDiv.style.left = ev.clientX + 'px';
oDiv.style.top = ev.clientY + 'px'; return false; } document.onclick = function() {
oDiv.style.display = 'none';
} }
</script>
</head> <body>
<div id="div1"></div>
</body>
</html>
上一篇:服务端预渲染之Nuxt(爬坑篇)


下一篇:Vue(SPA) WebPack模块化打包、SEO优化(Vue SSR服务端同构直出)、全浏览器兼容完整解决方案