클릭 시 호출 개체를 가져오는 방법은 무엇입니까?

클릭 시 호출 개체를 가져오는 방법은 무엇입니까?

호출 개체에 대한 처리기가 필요합니다.onclick사건의

<a href="123.com" onclick="click123(event);">link</a>

<script>
  function click123(event) {
    //i need <a> so i can manipulate it with Jquery
  }
</script>

사용하지 않고 이 작업을 수행합니다.$().click또는$().live위에서 설명한 방법을 사용하여 jQuery를 실행합니다.

을 건네주다this인라인 클릭 핸들러에서

<a href="123.com" onclick="click123(this);">link</a>

또는 사용event.target함수(W3C DOM 레벨 2 이벤트 모델에 따름)

function click123(event)
{
    var a = event.target;
}

하지만 물론 IE는 다르기 때문에 바닐라 자바스크립트 방식은

function doSomething(e) {
    var targ;
    if (!e) var e = window.event;
    if (e.target) targ = e.target;
    else if (e.srcElement) targ = e.srcElement;
    if (targ.nodeType == 3) // defeat Safari bug
        targ = targ.parentNode;
}

장황하지 않은

function doSomething(e) {

    e = e || window.event;
    var targ = e.target || e.srcElement || e;
    if (targ.nodeType == 3) targ = targ.parentNode; // defeat Safari bug
}

어디에e그것은event objectIE 이외의 브라우저에서 함수로 전달됩니다.

하지만 당신이 jQuery를 사용하고 있다면, 저는 방해가 되지 않는 JavaScript를 강력히 권장하고 jQuery를 사용하여 이벤트 핸들러를 요소에 바인딩할 것입니다.

가장 좋은 방법은 target 속성 대신 currentTarget 속성을 사용하는 것이라고 생각합니다.

이벤트 인터페이스의 currentTarget 읽기 전용 속성은 이벤트가 DOM을 통과할 때 이벤트의 현재 대상을 식별합니다.이벤트가 발생한 요소를 식별하는 Event.target과 달리 항상 이벤트 핸들러가 연결된 요소를 참조합니다.

예:

<a href="#"><span class="icon"></span> blah blah</a>

Javascript:

a.addEventListener('click', e => {
    e.currentTarget; // always returns "a" element
    e.target; // may return "a" or "span"
})

가장 쉬운 방법은 click123 기능으로 전달하거나 다음과 같은 작업(크로스 브라우저)을 수행할 수 있습니다.

function click123(e){
  e = e || window.event;
  var src = e.target || e.srcElement;
  //src element is the eventsource
}

http://docs.jquery.com/Events/jQuery.Event

사용해 보십시오.event.target

이벤트를 실행한 DOM 요소를 포함합니다.이 요소는 이벤트에 등록된 요소이거나 이벤트의 하위 요소일 수 있습니다.

당신의 방법의 문제는 당신의 HTML을 자바스크립트로 혼란스럽게 한다는 것입니다.만약 당신이 당신의 자바스크립트를 외부 파일에 넣는다면 당신은 방해받지 않고 당신의 HTML에 접근할 수 있고 이것은 훨씬 더 깔끔합니다.

나중에 addEventListener/attackEvent(IE)로 코드를 확장하여 메모리 누수를 방지할 수 있습니다.

이것은 jQuery가 없습니다.

<a href="123.com" id="elementid">link</a>

window.onload = function () {
  var el = document.getElementById('elementid');
  el.onclick = function (e) {
    var ev = e || window.event;
    // here u can use this or el as the HTML node
  }
}

당신은 jQuery로 그것을 조작하고 싶다고 말합니다.그래서 당신은 jQuery를 사용할 수 있습니다.이렇게 하는 것보다 훨씬 더 좋습니다.

// this is the window.onload startup of your JS as in my previous example. The difference is 
// that you can add multiple onload functions
$(function () {
  $('a#elementid').bind('click', function (e) {
    // "this" points to the <a> element
    // "e" points to the event object
  });
});

언급URL : https://stackoverflow.com/questions/1553661/how-to-get-the-onclick-calling-object