javascript/jquery를 사용하여 'a' 요소 클릭 시뮬레이션

javascript/jquery를 사용하여 'a' 요소 클릭 시뮬레이션

요소 클릭을 시뮬레이션하려고 합니다.동일한 HTML은 다음과 같습니다.

<a id="gift-close" href="javascript:void(0)" class="cart-mask-close p-abs" onclick="_gaq.push(['_trackEvent','voucher_new','cart',$(this).attr('rel')+'-mask_x_button-inaction']);" rel="coupon">&nbsp;</a>

클릭을 시뮬레이션하려면 어떻게 해야 합니까?난 시도했다.

document.getElementById("gift-close").click();

하지만 아무 것도 하지 않습니다.

jQuery 사용:$('#gift-close').trigger('click');

JavaScript 사용:document.getElementById('gift-close').click();

jQuery 사용:

$('#back-close').클릭();

사용해 보십시오.document.createEvent여기에 설명합니다. https://developer.mozilla.org/en-US/docs/Web/API/document.createEvent

클릭을 시뮬레이션하는 기능 코드는 다음과 같습니다.

function simulateClick() {
  var evt = document.createEvent("MouseEvents");
  evt.initMouseEvent("click", true, true, window,
    0, 0, 0, 0, 0, false, false, false, false, 0, null);
  var a = document.getElementById("gift-close"); 
  a.dispatchEvent(evt);      
}

이미 시도한 코드:

document.getElementById("gift-close").click();

...요소를 실행할 때 DOM에 요소가 실제로 존재하는 한 작동해야 합니다.이를 보장할 수 있는 몇 가지 방법은 다음과 같습니다.

1. 에서 코드 실행onload창 핸들러입니다.http://jsfiddle.net/LKNYg/
2. jQuery를 사용하는 경우 문서 준비 처리기에서 코드를 실행합니다.http://jsfiddle.net/LKNYg/1/
3. 소스 html의 요소 뒤에 있는 스크립트 블록에 코드를 넣습니다.

그래서:

$(document).ready(function() {
    document.getElementById("gift-close").click();
    // OR
    $("#gift-close")[0].click();
});

밑에 있는 코드 조각!

MDN에서 이 문서와 예제를 살펴보시면 답을 찾을 수 있습니다.이것이 제가 말하고 싶은 적절한 방법입니다.

이벤트 생성 및 트리거

디스패치 이벤트(예)

'발송 이벤트(예)'-HTML-link(클릭 시뮬레이션)에서 가져온 것:

function simulateClick() {

  var evt = document.createEvent("MouseEvents");

  evt.initMouseEvent("click", true, true, window,
    0, 0, 0, 0, 0, false, false, false, false, 0, null);

  var cb = document.getElementById("checkbox"); 
  var canceled = !cb.dispatchEvent(evt);

  if(canceled) {
    // A handler called preventDefault
    alert("canceled");
  } else {
    // None of the handlers called preventDefault
    alert("not canceled");
  }
}

제가 할 수 있는 방법은 이렇습니다 (2017..) :

단순히 마우스 이벤트를 사용합니다.

function simulateClick() {

    var evt = new MouseEvent("click");

    var cb = document.getElementById("checkbox");
    var canceled = !cb.dispatchEvent(evt);

    if (canceled) {
        // A handler called preventDefault
        console.log("canceled");
    } else {
        // None of the handlers called preventDefault
        console.log("not canceled");
    }
}

document.getElementById("button").onclick = evt => {
    
    simulateClick()
}

function simulateClick() {

    var evt = new MouseEvent("click");

    var cb = document.getElementById("checkbox");
    var canceled = !cb.dispatchEvent(evt);

    if (canceled) {
        // A handler called preventDefault
        console.log("canceled");
    } else {
        // None of the handlers called preventDefault
        console.log("not canceled");
    }
}

<input type="checkbox" id="checkbox">
<br>
<br>
<button id="button">Check it out, or not</button>

이 코드를 사용하여 다음을 클릭합니다.

$("#gift-close").click();

내부에 함수를 추가해 보십시오.click()방법.

$('#gift-close').click(function(){
  //do something here
});

빈칸을 유지하는 대신 클릭() 메서드 안에 할당된 기능으로 작동했습니다.

자, 이것을 사용해 보십시오.

$('#gift-close').on('click', function () {
    _gaq.push(['_trackEvent','voucher_new','cart',$(this).attr('rel')+'-mask_x_button-inaction']);
});

언급URL : https://stackoverflow.com/questions/17569012/simulate-a-click-on-a-element-using-javascript-jquery