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

时间:2013-07-10 11:04:31

标签: javascript jquery hyperlink click simulate

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

但它没有做任何事情

8 个答案:

答案 0 :(得分:91)

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

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

答案 1 :(得分:15)

尝试使用https://developer.mozilla.org/en-US/docs/Web/API/document.createEvent

中描述的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);      
}

答案 2 :(得分:14)

使用jQuery:

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

答案 3 :(得分:7)

您已经尝试过的代码:

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

...只要元素在运行时实际存在于DOM中,就应该有效。一些可能的方法来确保包括:

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

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

答案 4 :(得分:7)

下面的代码段!

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

Creating and triggering events

Dispatch Event (example)

取自'调度事件(示例)' - 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");
  }
}
  

我就是这样做的(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>

答案 5 :(得分:2)

使用此代码点击:

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

答案 6 :(得分:0)

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

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

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

答案 7 :(得分:-2)

在这里,试试这个:

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