使用 javascript/jquery 模拟点击“a”元素

Simulate a click on 'a' element using javascript/jquery

提问by user2373137

I am trying to simulate a click on on an element. HTML for the same is as follows

我正在尝试模拟对元素的点击。相同的 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>

How can i simulate a click on it. I have tried

我如何模拟点击它。我试过了

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

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

But its not doing anything

但它没有做任何事情

回答by André Dion

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

使用jQuery： $('#gift-close').trigger('click');

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

使用 JavaScript： document.getElementById('gift-close').click();

回答by Alex Guerra

Using jQuery:

使用jQuery：

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

回答by ihor marusyk

Try to use document.createEventdescribed here https://developer.mozilla.org/en-US/docs/Web/API/document.createEvent

尝试使用document.createEvent这里描述的https://developer.mozilla.org/en-US/docs/Web/API/document.createEvent

The code for function that simulates click should look something like this:

模拟点击的函数代码应如下所示：

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);      
}

回答by ravo10

Code snippet underneath!

下面的代码片段！

Please take a look at these documentations and examples at MDN, and you will find your answer. This is the propper way to do it I would say.

请在MDN 上查看这些文档和示例，您将找到答案。这是我要说的正确方法。

Creating and triggering events

创建和触发事件

Dispatch Event (example)

调度事件（示例）

Taken from the 'Dispatch Event (example)'-HTML-link (simulate click):

取自“调度事件（示例）”-HTML 链接（模拟点击）：

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");
  }
}

This is how I would do it (2017 ..) :

Simply using MouseEvent.

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");
    }
}

这就是我的做法（2017 年 ..）：

只需使用MouseEvent。

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>

回答by nnnnnn

The code you've already tried:

您已经尝试过的代码：

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

...should work as long as the element actually exists in the DOM at the time you run it. Some possible ways to ensure that include:

...只要元素在您运行时实际存在于 DOM 中，它就应该可以工作。确保这一点的一些可能方法包括：

1. Run your code from an onloadhandler for the window. http://jsfiddle.net/LKNYg/
2. Run your code from a document ready handler if you're using jQuery. http://jsfiddle.net/LKNYg/1/
3. Put the code in a script block that is afterthe element in the source html.

1. 从onload窗口的处理程序运行您的代码。http://jsfiddle.net/LKNYg/
2. 如果您使用 jQuery，请从文档就绪处理程序运行您的代码。http://jsfiddle.net/LKNYg/1/
3. 将代码放在源 html 中元素之后的脚本块中。

So:

所以：

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

回答by Farid Imranov

Use this code to click:

使用此代码单击：

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

回答by Neo

Try adding a function inside the click()method.

尝试在click()方法中添加一个函数。

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

It worked for me with a function assigned inside the click() method rather than keeping it empty.

它对我有用，在 click() 方法中分配了一个函数，而不是将其保留为空。

回答by Neo

Here, try this one:

来，试试这个：

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