<!DOCTYPE html >
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link rel="stylesheet" type="text/css" href="../csss/basic.css" />
<style type="text/css">
#Testss{ width:120px; background:#CFF; position:absolute; display:none; z-index:99;}
#Testss ul li{ height:28px; line-height:28px; border-bottom:#FFF solid 1px;}
#Testss ul li.on{ background:#F6F}
</style>
<script language="javascript" src="../csss/jquery-1.7.1.min.js"></script>
</head>
<body>
<div id="button" style="width:200px; height:200px; background:#FCF">
<input type="button" value="click me" id="clickMe" />
</div>
<p>
<input type="text" id="t1" tabindex="1" value="1" /> <input type="text" tabindex="3" value="3" />
</p>
<p>
<input id="test" type="text" tabindex="2" value="2" /> <input type="text" tabindex="4" value="4" />
</p>
<div id="show" style="border:#F00 solid 1px; background-color:#9FF; height:40px; display:none"></div>
<div id="Testss">
<ul>
<li class="on">aaaaaaa</li>
<li>bbbbbbb</li>
<li>ccccccc</li>
<li>ddddddd</li>
</ul>
</div>
<script language="javascript" type="text/javascript">
/*var input = document.getElementById('t1');
input.οnclick=function(){alert(1)};
input.οnclick=function(){alert(2)};
input.select();
input.addEventListener("select",function(){
alert("dd");
},false);*/
//alert(~"d");
new Function("return" + alert("hello"));
var obj1={};
(function(window){
//alert(window);
obj1.test=function(obj){
alert(obj);
}
})(this)
//obj1.test(111);
document.body.normalize();
document.getElementById('clickMe').style.cssText
var bod = document.getElementById('button');
bod.οnclick=function(event){
var event = event || window.event;
if((event.target?event.target.id:event.srcElement.id)=='clickMe'){
alert("hello");
}
}
document.onc
document.body.οnmοuseup=function(event){
var event = event || window.event;
if(event.button==2){
document.getElementById('show').style.display="block";
}
}
document.οnmοusedοwn=function(event){
var event = event || window.event;
if(event.button==2){
document.getElementById('show').style.display="block";
}
}
function stop(){
return false;
}
//上下文菜单禁用
//document.οncοntextmenu=stop;
/*document.οncοntextmenu=function(event){
var event = event || window.event;
try{
event.preventdefault();
}
catch(ex){
event.returnValue=false;
}
}*/
var btn = document.getElementById('test');
//组合键shift+@ 时弹出提示
btn.οnkeyup=function(event){
var event = event || window.event;
if(event.shiftKey && event.keyCode==50){
alert("hll");
}
}
//监听键盘的上下键
$(document).keyup(function(event){
var event = event || window.event;
//alert(event.keyCode);
if(event.keyCode==40){
$("#Testss ul li.on").next().addClass('on').siblings().removeClass('on');
//event.target.className='on';
}else if(event.keyCode==38){
$("#Testss ul li.on").prev().addClass('on').siblings().removeClass('on');
}
});
var button = document.getElementById('button');
button.οncοntextmenu=function(event){
var event = event || window.event;
try{
event.preventDeafult();
if(event.target?event.target.tagName:event.srcElement.tageName=="li"){
event.preventDefault();
}
}catch(e){
if(event.target?event.target.tagName:event.srcElement.tageName=="li"){
event.preventDefault();
}
event.returnValue=false;
}
var div = document.getElementById('Testss');
div.style.top= event.clientY+"px";
div.style.left = event.clientX+"px";
div.style.display="block";
}
//对右键点击的UL LI 点击弹出层消失
document.getElementById('Testss').οnclick=function(event){
var event = event || window.event;
var target = (event.target?event.target.tagName:event.srcElement.tagName).toLowerCase();
if(target=="li"){
document.getElementById('Testss').style.display="none";
}
}
button.onmouseout = function(event){
var event = event || window.event;
var target=null;
if(event.relatedTarget){
target = event.relatedTarget;
}else if(event.toElement){
target = event.toElement;
}else if(event.fromElement){
target = event.fromElement;
}
if(target){
console.log(target.tagName+"****");
if(target.id.toLowerCase()!="button"&&target.id.toLowerCase()!="Testss"&&target.tagName.toLowerCase()!="li" ){
console.log("22222");
console.log(target.id!="button");
console.log(target.tagName);
document.getElementById('Testss').style.display="none";
debugger;
}
}
}
document.getElementById('Testss').οnmοuseοut= function(event){
var event = event || window.event;
var target=null;
if(event.relatedTarget){
target = event.relatedTarget;
}else if(event.toElement){
target = event.toElement;
}else if(event.fromElement){
target = event.fromElement;
}
//alert(target.id);
if(target){
console.log(target.id+"-------@@@"+target.tagName);
if(target.id.toLowerCase()!="button"&&target.id.toLowerCase()!="Testss"&&target.tagName.toLowerCase()!="li"){
console.log("3333");
document.getElementById('Testss').style.display="none";
debugger;
}
}
}
window.onbeforeοnlοad=function(event){
var event = event || window.event;
alert("eeee");
event.returnValue="Are you sure close this page!"
}
</script>
</body>
</html>
禁用上下文菜单事件 自定义显示上下文、事件委托、悬浮显示弹出层
最新推荐文章于 2020-02-25 19:21:27 发布