当前位置: 代码迷 >> Web前端 >> ie 六 分析事件
  详细解决方案

ie 六 分析事件

热度:246   发布时间:2012-11-14 10:12:18.0
ie 6 分析事件
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script src="event_utils.js">
</script>
</HEAD>
<!--
 onmousedown 
 onmouseup  不会触发click

 mousemove --mouseover --(mousemove ...)
 --mousedown--focus--mouseup--click --keydown 
 --keyup --mousemove --mouseout --change -blur
-->

<BODY>
<div id="divEvent" oncontextmenu="return false;" style="border: dotted 1px blue;
    width: 170px; height: 100px; padding: 10px" >
</div>

Right click the above rectangle.

<br/>
<div id="divc">
<input type="text" name = 'test' id='testevent' />
</div>
<a class="a02" target="_blank" id='testlink' href="http://50813.blog.kangq.com/messagebox.php?action=center">[查看]</a>
<br/>

<textarea name = 'test' id='textareaId' rows = "15" cols="150" >
</textarea>

<input type="text" name = 'test' id='testinput2'   onkeypress="doClick('testinput2', event)"/>
<script>
var divObj = document.getElementById('divEvent');
var intObj = document.getElementById('testevent');
divObj.onmousedown = function (){
	ShowContextMenu(divObj);
} ;

function log( ){
	var evt = window.event;
	textareaId.value=textareaId.value+"\r\n"+"type:"+evt.type+" x:"+evt.offsetX+" y:"+evt.offsetY 
		+" srcElement:"+evt.srcElement.id+"  evt.button:"+evt.button+"  evt.keyCode:"+evt.keyCode;
}
intObj.onmousedown = function (){
	log();
}

var divobj = document.getElementById('divc');

divobj.onclick = function(){
	textareaId.value=textareaId.value+"\r\n"+"divobj.onclick";
}

divobj.onkeyup = function(){
	textareaId.value=textareaId.value+"\r\n"+"divobj.onkeyup";
}
divobj.onmousedown = function(){
	textareaId.value=textareaId.value+"\r\n"+"divobj.onmousedown";
}
intObj.onmousemove = log;
intObj.onmouseover = log;
intObj.onmousemove = log;
intObj.onmousemove = log;
intObj.onmousedown = function (){
	//window.event.cancelBubble = true;	
	log();
}
intObj.onfocus = function (){
	log();
}
intObj.onmousemove = log;
intObj.onmouseup = function(){
	log();
}
intObj.onclick = function (){

	//alert(window.event.cancelBubble);
	//alert(window.event.fuyou);
	//window.event.cancelBubble = true;
	//alert(window.event.cancelBubble);
	log();
};
intObj.onkeydown = log;
//intObj.value = 'sjeoise';
intObj.onkeyup =  function (){
	//window.event.cancelBubble = true;
	log();
}
intObj.onmousemove = log;
intObj.onmousemove = log;
intObj.onmouseout = log;
intObj.onchange = log;
intObj.onblur = log;


function ShowContextMenu(elmt)
{
    var evt = elmt.document.parentWindow.event;
    if ( evt.button == 2 )
    {
        var popup = window.createPopup();
        var menuHTML = "<div style='width:100%;height:100%;border: solid 1px red'>Context Menu</div>";
        popup.document.body.innerHTML = menuHTML;
        popup.show(evt.offsetX, evt.offsetY, 100, 24, elmt);
    }
    divEvent.innerText = '"onmousedown" event fired in this divsion element.';
}
</script>
<script Language="javascript">

function test(){
	return;
}
//alert(test());
function RunEvent()
{
     // divEvent.onmousedown();
    divEvent.fireEvent('onmousedown');
}

function FireEvent()
{
	 // var rect = divEvent.getBoundingClientRect();
   // evt.offsetX = (rect.right+rect.left)/2;
   // evt.offsetY = (rect.bottom-rect.top)/2;

    var evt = document.createEventObject();
    evt.button = 2;
    evt.type = 'onmousedown';
    var rect = divEvent.getBoundingClientRect();
    evt.offsetX = 700;
    evt.offsetY = 700;
    divEvent.fireEvent('onmousedown', evt);
}
</script> 

<script type="text/javascript">
function SimEvents2 (srcElement,lrMouse,eventname,keyCode){
	var obj = document.getElementById(srcElement); 
	if(obj){
		 var rect = obj.getBoundingClientRect();
		 var x1 = Math.ceil(Math.random()*(rect.right-rect.left));
    	 var y1 = Math.ceil(Math.random()*(rect.bottom-rect.top));	
	 
 		 var evt = document.createEventObject();
	  		 evt.button = lrMouse;
   			 evt.type = eventname;
   			 alert(typeof keyCode);
   			 if(typeof keyCode!=undefined){
   			 	evt.keyCode = keyCode;
   			 }
   			 evt.offsetX = x1;
   			 evt.offsetY = y1;
   			 evt.cancelBubble = true;
   			 //alert(window.event)
   			//cancelBubble = true;
   			 evt.fuyou='fuyou001';
   			 //alert(evt.cancelBubble);
   			 obj.fireEvent(eventname, evt);//与window.event是同一对象,但却不设置取消冒泡
   			 
	}
}
function clickByEvent(id){
	var obj = document.getElementById(id);
	if(obj){
		SimEvents2(id,0,'onmousemove');
   	 	SimEvents2(id,0,'onmouseover');
    	SimEvents2(id,0,'onmousedown');
		SimEvents2(id,0,'onfocus');
		SimEvents2(id,0,'onmouseup');
		SimEvents2(id,0,'onclick');
		SimEvents2(id,0,'onmouseout');
	}
}

function setValueByEvent(name,value){
	var obj = document.getElementById(name);
	if(obj&&value){
	SimEvents2(name,0,'onmousemove');
    SimEvents2(name,0,'onmouseover');
   // SimEvents2(name,0,'onmousemove');
   // SimEvents2(name,0,'onmouseover');
    SimEvents2(name,0,'onmousedown');
	SimEvents2('testevent',0,'onfocus');
	SimEvents2('testevent',0,'onmouseup');
	SimEvents2('testevent',0,'onclick');
    SimEvents2('testevent',0,'onkeydown');
    
    for(var i=0;i<value.length;i++){
       var tempChar = value.substring(i,i+1);
    	SimEvents2('testevent',0,'onkeydown',tempChar.charCodeAt());
    	obj.value=obj.value+tempChar;
    	SimEvents2('testevent',0,'onkeyup',tempChar.charCodeAt());
    }
	//obj.value = value;
	//alert(value.substring(0,1).charCodeAt())
	
	SimEvents2('testevent',0,'onkeyup');
	SimEvents2('testevent',0,'onmousemove');
	SimEvents2('testevent',0,'onmouseout');
	SimEvents2('testevent',0,'onchange');
	SimEvents2('testevent',0,'onblur');
	}
}
	//setValueByEvent('testevent','123456abcdef');
/*
  * 测试冒泡
var divObj = document.getElementById('divc');

var intObj = document.getElementById('testevent');
intObj.onclick = function (){
	window.event.cancelBubble = true; 
	alert('intObj click');
}
divObj.onclick = function (){
	alert('divObj click');
}
*/
var obj =
document.getElementById('testlink');
ev_SimEvents2(obj,0,'onclick');
</script>
<br />
<button onclick="RunEvent()">
    Run Event</button>
<button onclick="FireEvent()">
    Fire Event</button>
<br/>
<br/>
<button onclick="document.location.href=document.location.href">
    Refresh</button> 
</BODY>
</HTML>

鼠标靠近input 输入框,会在下面的div中显示一系列事件

比如:点击事件,会触发哪些事件
  相关解决方案