在逛一些知名图片社区的时候，遇到自己心怡的图片，想要右键另存的时候，默认的浏览器菜单不见了，却出现了如：[©kevin版权所有]之类的信息；

今天在看Javascript事件默认行为相关的知识，所以，动手实现了下类似效果：

鼠标右键的时候，会出现如下所示的内容

在线演示地址：http://codepen.io/anon/pen/xGyXVy

相关代码：

<!DOCTYPE html>

<html lang="en">

<head>

	<meta charset="UTF-8">

	<title>javascript:事件默认行为</title>

	<style type="text/css">

    #div1{

    	display: none;

    	position: absolute;

        padding: 6px 10px;

        color:#fff;

        border-radius: 3px;

    	background-color: #666;

    }

	</style>

</head>

<body>

<div id="div1">&copy kevin版权所有</div>

<script type="text/javascript">

	//oncontextmenu:右键菜单(环境菜单)显示的时候触发，通过return false阻止默认事件

	var oDiv1=document.getElementById('div1');

	document.oncontextmenu=function(ev){

		var ev=ev || event;

		var scrollTop=document.documentElement.scrollTop || document.body.scrollTop;

		oDiv1.style.display='block';

        oDiv1.style.left=ev.clientX +scrollTop+ 'px';

        oDiv1.style.top=ev.clientY +scrollTop+ 'px';

		return false;

	}

</script>

</body>

</html>

　　

Javascript:阻止浏览器默认右键事件，并显示定制内容的更多相关文章

  1. day49—JavaScript阻止浏览器默认行为

    转行学开发,代码100天——2018-05-04 今天主要说明一下通过JavaScript对浏览器默认行为的阻止操作.比如右键菜单的行为. 阻止默认行为的语句为: return false; 例如,阻 ...

  2. 纯JS阻止浏览器默认滚动事件，实现自定义滚动方法

    首先该方法兼容IE7+以上浏览器,可以实现页面上下滚动,而且也可以实现页面左右滚动,每次滚动的距离为屏幕的大小,滚动为加速滚动 javaScript代码如下: //滚动实现方法,使用鼠标滚轮每次滚动浏 ...

  3. javaScript事件机制深入学习(事件冒泡，事件捕获，事件绑定方式，移除事件方式，阻止浏览器默认行为，事件委托，模拟浏览器事件，自定义事件)

    前言 JavaScript与HTML之间的交互是通过事件实现的.事件,就是文档或浏览器窗口中发生的一些特定的交互瞬间.可以使用侦听器(或处理程序)来预订事件,以便事件发生时执行相应的代码.这种在传统软 ...

  4. 原生javascript实现阻止浏览器默认行为与阻止事件冒泡

    不同的浏览器之间存在兼容问题,在IE与标准浏览器之间存在很大的差异,所以在实现阻止浏览器默认行为和阻止事件冒泡就要考虑要它们之间的不同 /** * 取消冒泡 * @param {事件} e */ fu ...

  5. 理解阻止浏览器默认事件和事件冒泡cancelBubble

    一.阻止浏览器默认事件 1.先举个例子说什么是 浏览器的默认事件 : 比如有一个输入框,当我按下字母a,就会在输入框显示字母a.就是浏览器本该发生的事情.小孩子一出生就会汲取母乳一样的道理,这些都是先 ...

  6. JQuery 阻止js事件冒泡 阻止浏览器默认操作

    //阻止事件冒泡 event.stopPropagation(); //阻止浏览器默认操作 event.preventDefault(); 代码不一定能执行,写给自己看的. 事件冒泡: <a h ...

  7. js添加事件、移除事件、阻止冒泡、阻止浏览器默认行为等写法(兼容IE/FF/CHROME)

    转自:http://blog.csdn.net/itchiang/article/details/7769341 添加事件   var addEvent = function( obj, type, ...

  8. javascript小实例，阻止浏览器默认行为，真的能阻止吗?支持IE和标准浏览器的阻止默认行为的方法

    看到这标题,是不是有点逆天的感觉,总感觉好狂拽炫酷,耳边隐隐约约传来一个声音:你这么叼,你咋不上天呢! ~~ 额,好吧! 话入正题,我为什么会提出这么一个问题呢? 阻止浏览器默认行为,真的能阻止吗?那 ...

  9. js停止冒泡和阻止浏览器默认行为

    停止冒泡通用方法: function stopBubble(e) { //如果提供了事件对象,是非IE浏览器 if ( e && e.stopPropagation ) //使用W3C ...

随机推荐

  1. Centos6 安装vnc

    Centos6 安装vnc 1. 安装 使用yum方式安装 yum install tigervnc-server tigervnc #启动 vncserver #重启动 /etc/init.d/vn ...

  2. HTTP调试 抓包 工具 Fiddle 简介 示例

    简介 1.常用抓包工具对比: Firebug虽然可以抓包,但是对于分析http请求的详细信息,不够强大.模拟http请求的功能也不够,且firebug常常是需要"无刷新修改",如果 ...

  3. android系统360浏览器使用append动态添加元素出现黑色错乱背景

    去掉样式 backface-visibility:hidden;

  4. 2015-09-28 Javascript

    1.Javascript是什么? JavaScript是一种脚本语言,结构简单,使用方便,其代码可以直接放入HTML文档中,可以直接在支持JavaScript的浏览器中运行.JavaSript. Ja ...

  5. (转)用JS判断ckeditor3.6版本编辑器内容为空的方法

    因为编者我还是一个初学入门者,无论是JS还是PHP,都是懂了点皮毛.今天在研究ckeditor编辑器的时候遇到了一些问题,虽然这只是我的个人问题,但觉得可以分享给其他人,或许也有像我这样的初学者也会遇 ...

  6. (转)SQL流程控制语句学习（一）：变量及控制语句种类

    1.局部变量 用户自己定义的,称局部变量,以@标识. 作用范围:定义局部变量的批处理.存储过程.触发器和语句块 局部变量的定义: declare @局部变量名 数据类型 注意:变量的类型不能是text ...

  7. ViewPager Indicator的使用方法

    原文:http://my.oschina.net/u/1403288/blog/208402 项目源码:https://github.com/wangjing0311/ViewPagerIndicat ...

  8. Arcgis Android 基本概念 - 浅谈

    MapView     MapView 是 Android 中 ViewGroup的子类,也是 ArcGIS Runtime SDK for Android 中的地图容器,与很多 ArcGIS API ...

  9. 武汉科技大学ACM：1005: 华科版C语言程序设计教程（第二版）例题5.8

    Problem Description 老师给小豪出了一道题目:给你两个整数x和n(-10<=x<=10,1<=n<=10),让你求出x^1+x^2+x^3+……+x^n的结果 ...

  10. 狗狗40题~ (Volume C)

    A - Triangles 记忆化搜索呗.搜索以某三角形为顶的最大面积,注意边界情况. #include <stdio.h> #include <cstring> #inclu ...