e.target 및 e.event 및 event.srcElement

5576 단어 element
e.target은 목표 대상, e.event는 목표가 발생하는 이벤트, 이벤트.srcElement 현재 이벤트 역할의 객체 캡처
1.
 1 $(function(){

 2     $("li:has(ul)").click(function(e){

 3         if(this==e.target){

 4             $(this).children().toggle();

 5             $(this).css("list-style-image",($(this).children().is(":hidden")?"url(plus.gif)":"url(minus.gif)"))

 6         }

 7         return false;    // 

 8     }).css("cursor","pointer").click();    // 

 9    

10     //

11     $("li:not(:has(ul))").css({

12         "cursor":"default",

13         "list-style-image":"none"

14     });

15 });

구체적인 문제를 구체적으로 분석하다.현재 목표는 이벤트 이벤트에서 클릭 대상을 대표합니다.loader 이벤트:객체 로드;e는 매개 변수일 뿐, 임의로 값을 얻는다.대응하면 된다.
1 $(function(){

2     $(document).bind("click", function (e) {

3         $(e.target).closest("p").css("color","red");

4     })

5   });

e. target은 이벤트 원본입니다. 예를 들어 을 누르면 이 이벤트 원본이 이 button입니다. $(e.target) 이 뜻은 이벤트 원본을 전송하고 button이라는 대상을 얻는 것이다. 이것은document에 해당한다.getElementById () 와 같은 방법입니다.
2.
Flex와 유사하게 JavaScript의 이벤트도 마찬가지로 존재한다. 포획-촉발-거품 세 노드.비교적 흔히 볼 수 있는 상황은 하위 DIV가 사건을 촉발할 때 부모 DIV도 같은 사건을 감청하면 함께 촉발하고 거품이 생긴다는 것이다
jQuery 이벤트 감청 함수는 기본적으로 이벤트나 e로 지정됩니다. (필요하지 않아도 임의로 지정할 수 있습니다.)
e, 이벤트 매개 변수에서 다음 속성을 지원합니다. 이벤트.stopPropagation(); 이벤트 거품을 멈추는 방법 이벤트.preventDefault(); 기본 비헤이비어 구성 - 하이퍼링크 점프
더 간단한 방법:return false, 상기 두 가지 모두 같은 작용
event.type – click event와 같은 이벤트 유형target---이벤트의 html 요소 대상 이벤트.relatedTarget () - 예를 들어mouseover 이벤트가 터치될 때 관련 요소, 예를 들어 다른mouseout 요소 이벤트.pageX()/event.페이지 Y() - 페이지의 x, y 좌표 이벤트에 상대적입니다.which () - 이벤트와 관련된 키보드 또는 마우스의 키 값 이벤트를 가져옵니다.metaKey () - 이벤트에 ctrl 키 이벤트가 포함되어 있는지 판단합니다.originalEvent () - 원래 이벤트 객체를 가리킵니다.
3.event.srcElement은 이벤트와 같은 현재 이벤트 작용의 대상을 포착할 수 있습니다.srcElement.tagName은 활성 태그 이름을 캡처할 수 있습니다.
가져온 태그는 TD, TR, A와 같은 대문자로 표시됩니다.
 

<script type="text/javascript"> 

function tdclick(){ 

if(event.srcElement.tagName.toLowerCase()=='td') 

alert(" :"+(event.srcElement.parentNode.rowIndex+1)+" :"+(event.srcElement.cellIndex+1)); 

} 

</script> 


IE에서 이벤트 대상은 srcElement 속성이 있지만 target 속성이 없습니다.Firefox에서 이벤트 대상은 target 속성이 있지만 srcElement 속성이 없습니다.그러나 그들의 역할은 상당하다. 해결 방법:obj(obj=event.srcElement?event.srcElement:event.target;)IE의 이벤트를 대신합니다.srcElement 또는 Firefox의 이벤트target. 
event.srcElement.selectedIndex는 일반적으로 select 쌍에 사용됩니다.
<input type=button value=GO title="?page=1"> 

<script language="JavaScript"> 

function f() 

{ 

alert('index.asp'+event.srcElement.title) 

location.href='index.asp'+event.srcElement.title 

} 

</script> 

<a title="a " >a </a> 

<br> 

<table border=1 width="200"> 

<tr title="tr " ><td>tr</td></tr> 

</table> 

<table border=1 width="200"> 

<tr><td title="td " >td</td></tr> 

</table> 

<select > 

<option value="1">1</option> 

<option value="2">2</option> 

<option value="3">3</option> 

<option value="4">4</option> 

<option value="5">5</option> 

</select> 

event.srcElement의 하위 태그와 상위 태그: 첫 번째 하위 태그는 이벤트입니다.srcElement.퍼스트 차일드 마지막은 이벤트.srcElement.lastChild도 이벤트로 할 수 있죠.srcElement.children[i] event.srcElement.ChildNode[i]의 이벤트srcElement.parentElement은 마우스가 있는 대상의 이전 대상을 가리킨다.

좋은 웹페이지 즐겨찾기