資訊專欄INFORMATION COLUMN
摘要：事件在版火狐瀏覽器下表現(xiàn)差異谷歌和其它瀏覽器打印復制阻止右鍵系統(tǒng)默認的彈出框除了火狐，在其他瀏覽器上的交互右鍵執(zhí)行事件火狐是的時候執(zhí)行抬起消失兼容寫法思路阻止默認事件右鍵展示重寫菜單左鍵隱藏
oncontextmenu事件 在MAC版火狐瀏覽器下表現(xiàn)差異
谷歌和其它瀏覽器
//css
*{margin:0;padding:0;}
#right-menu{position:absolute;width:150px;visibility:hidden;border:1px solid #bababa;box-shadow: 1px 1px 2px #8e8e8e;}
#right-menu li{list-style:none;text-indent:1em;}
#right-menu li a{display:block;height:30px;line-height:30px;text-decoration:none;color:#666;font-size: 12px;}
#right-menu li a:hover{background:#ebebeb;color:black;}
//html
//js
document.oncontextmenu = function(e){
if(window.event) e = window.event;
var mymenu = document.getElementById("right-menu");
mymenu.style.visibility = "visible";
mymenu.style.left = e.clientX + 5 +"px";
mymenu.style.top = e.clientY + 5 + "px";
return false;//阻止右鍵系統(tǒng)默認的彈出框
};
document.onclick = function(){
var mymenu = document.getElementById("right-menu");
mymenu.style.visibility = "hidden";
}
//除了火狐，oncontextmenu在其他瀏覽器上的交互 右鍵mouseup 執(zhí)行事件
//火狐是mousedown的時候執(zhí)行 抬起消失
兼容寫法
document.oncontextmenu = function(e){
return false;
};
document.onmouseup=function(e) {
var mymenu = document.getElementById("right-menu");
if (!e) e=window.event;
if (e.button==0) {
mymenu.style.visibility = "hidden";
}
if (e.button==2) {
mymenu.style.visibility = "visible";
mymenu.style.left = e.clientX + 5 +"px";
mymenu.style.top = e.clientY + 5 + "px";
}
}
//思路
1.阻止默認事件
2.mouseup 右鍵展示重寫菜單 左鍵隱藏
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/102196.html
摘要：學習要點傳統(tǒng)事件綁定的問題事件處理函數(shù)事件處理函數(shù)事件對象的其他補充事件綁定分為兩種一種是傳統(tǒng)事件綁定內(nèi)聯(lián)模型，腳本模型，一種是現(xiàn)代事件綁定級模型。現(xiàn)代事件綁定在傳統(tǒng)綁定上提供了更強大更方便的功能。事件和事件事件和事件，有關(guān)加載方面的事件。 學習要點： 1.傳統(tǒng)事件綁定的問題2.W3C事件處理函數(shù)3.IE事件處理函數(shù)4.事件對象的其他補充 事件綁定分為兩種：一種是傳統(tǒng)事件綁定（內(nèi)聯(lián)模型...
摘要：前端技術(shù)前文了解了什么是前端，那么前端技術(shù)到底有哪些呢最核心的就這三個什么是，超文本標記語言，標準通用標記語言下的一個應用那么超文本標記語言又是什么呢哈哈，沒完沒了是吧，學習就是要這種沒完沒了的勁。前端技術(shù) 前文了解了什么是前端，那么前端技術(shù)到底有哪些呢？最核心的就這三個： html/html5 css/css3 javascript 什么是HTML HyperText Mark...
摘要：前言本篇文章是基礎知識的篇，如果前面的基礎知識入門篇看完了，現(xiàn)在就可以學習了?；靖拍罘譃槿齻€部分。在這個基礎上使用一些新特性，高級瀏覽器支持，低級瀏覽器不支持。在對象中的屬性是一個布爾值，只有和。 showImg(https://segmentfault.com/img/remote/1460000012581493?w=1920&h=1080); DOM 前言 本篇文章是JavaS...
摘要：一背景筆者月份在慕課網(wǎng)錄制視頻教程跨站漏洞加強安全里面需要講到很多實戰(zhàn)案例，在漏洞挖掘案例中分為了手工挖掘工具挖掘代碼審計三部分內(nèi)容手工挖掘篇參考地址為快速找出網(wǎng)站中可能存在的漏洞實踐一本文主要記錄利用安全工具進行漏洞挖掘部分，分為了設置代 一、背景 筆者6月份在慕課網(wǎng)錄制視頻教程XSS跨站漏洞 加強Web安全,里面需要講到很多實戰(zhàn)案例，在漏洞挖掘案例中分為了手工挖掘、工具挖掘、代碼審...
閱讀 3207·2021-11-25 09:43
閱讀 3417·2021-11-11 16:54
閱讀 843·2021-11-02 14:42
閱讀 3769·2021-09-30 09:58
閱讀 3675·2021-09-29 09:44
閱讀 1288·2019-08-30 15:56
閱讀 2109·2019-08-30 15:54
閱讀 2995·2019-08-30 15:43
