[javascript] JavaScript로 클릭을 시뮬레이션하는 방법은 무엇입니까?

JavaScript를 사용하여 요소에 대한 클릭을 시뮬레이션하는 방법이 궁금합니다.

현재 나는 :

<script type="text/javascript">
function simulateClick(control)
{
    if (document.all)
    {
        control.click();
    }
    else
    {
        var evObj = document.createEvent('MouseEvents');
        evObj.initMouseEvent('click', true, true, window, 1, 12, 345, 7, 220, false, false, true, false, 0, null );
        control.dispatchEvent(evObj);
    }
}
</script>

<a href="http://www.google.com" id="mytest1">test 1</a><br>

<script type="text/javascript">
    simulateClick(document.getElementById('mytest1'));
</script>

그러나 작동하지 않습니다 🙁

어떤 아이디어?

답변

내가 요리 한 것입니다. 꽤 간단하지만 작동합니다.

function eventFire(el, etype){
  if (el.fireEvent) {
    el.fireEvent('on' + etype);
  } else {
    var evObj = document.createEvent('Events');
    evObj.initEvent(etype, true, false);
    el.dispatchEvent(evObj);
  }
}

용법:

eventFire(document.getElementById('mytest1'), 'click');

답변

다음과 같은 간단한 것은 어떻습니까?

document.getElementById('elementID').click();

IE에서도 지원 됩니다.

답변

모든 브라우저 감지를 피하기 위해 jQuery 사용을 고려 했습니까? jQuery를 사용하면 다음과 같이 간단합니다.

$("#mytest1").click();

답변

var elem = document.getElementById('mytest1');

// Simulate clicking on the specified element.
triggerEvent( elem, 'click' );

/**
 * Trigger the specified event on the specified element.
 * @param  {Object} elem  the target element.
 * @param  {String} event the type of the event (e.g. 'click').
 */
function triggerEvent( elem, event ) {
  var clickEvent = new Event( event ); // Create the event.
  elem.dispatchEvent( clickEvent );    // Dispatch the event.
}

참고

답변

jQuery를 사용하면 많은 공간을 절약 할 수 있습니다. 다음을 사용해야합니다.

$('#myElement').trigger("click")

답변

최고 답변이 최고입니다! 그러나 Firefox에서 마우스 이벤트가 발생하지 않았습니다 etype = 'click'.

그래서, 나는 변화 document.createEvent에 'MouseEvents'그 문제를 해결했습니다. 추가 코드는 다른 코드 비트가 이벤트를 방해하는지 여부를 테스트하는 것이며 취소 된 경우 콘솔에 기록합니다.

function eventFire(el, etype){
  if (el.fireEvent) {
    el.fireEvent('on' + etype);
  } else {
    var evObj = document.createEvent('MouseEvents');
    evObj.initEvent(etype, true, false);
    var canceled = !el.dispatchEvent(evObj);
    if (canceled) {
      // A handler called preventDefault.
      console.log("automatic click canceled");
    } else {
      // None of the handlers called preventDefault.
    }
  }
}

답변

document.getElementById('elementId').dispatchEvent(new MouseEvent("click",{bubbles: true, cancellable: true}));

이 링크를 따라 Javascript 및 브라우저 호환성을 사용하는 마우스 이벤트에 대해 알 수 있습니다.

https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent#Browser_compatibility