jquery trigger or click not working?

Question

I am really struggling why I can't get this trigger or click to work?

here is the JS:

$(document).ready(function () {     

    function libertyPop(){  
        var popUp = jQuery("#lightbox-30835684809970");
        popUp.click();
        popUp.trigger('click');
        console.log("should work");
    }

    libertyPop();
});

This should be triggering a click on this anchor:

<a id="lightbox-30835684809970" style="cursor:pointer;color:blue;text-decoration:underline;">
    Liberty Pop-Up
</a>

In the page, when I actually click on the link, the pop up will appear, i don't understand why the jquery 'trigger' or 'click' is not doing the same?

Are you triggering the click handler before you've attached it? — billyonecan
– billyonecan, Commented Jul 31, 2013 at 13:05
BTW, your code is quite ugly here. Why set the click handler inside a function? — A. Wolff
– A. Wolff, Commented Jul 31, 2013 at 13:06
@Xtian so what is supposed to do the click on anchor? With the code you provide, it'll do nothing — A. Wolff
– A. Wolff, Commented Jul 31, 2013 at 13:07
Presumably you have a lightbox plugin, and at some point you're initialising the plugin on your element. If you're triggering the click handler before initialising the plugin on that element, it won't do anything — billyonecan
– billyonecan, Commented Jul 31, 2013 at 13:08

A. Wolff · Accepted Answer · 2013-07-31 13:09:09Z

4

If you want to trigger native click event of anchor tag, use js event:

 var popUp = jQuery("#lightbox-30835684809970")[0]; //<< [0] will retruns the DOM node

  popUp.click();

But as you didn't have setted attribute href, this will do nothing!

If you want to trigger click handler attached using jQuery, first set one.

Using your code:

$(document).ready(function () {     

    function libertyPop(){  
        var popUp = jQuery("#lightbox-30835684809970");
        popUp.on('click',function(){
            console.log("WORKS!");
        }).click();
    }

    libertyPop();
});

edited Jul 31, 2013 at 13:09

answered Jul 31, 2013 at 13:03

A. Wolff

74.4k9 gold badges98 silver badges158 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

shennan · Accepted Answer · 2013-07-31 13:10:29Z

2

You're not actually adding an event handler before triggering the event. It has nothing to do...

Try this:

$(document).ready(function(){

    $("#lightbox-30835684809970").click(function(){

        console.log('clicked');

    });

    $("#lightbox-30835684809970").trigger('click');

});

Here's a jsFiddle

answered Jul 31, 2013 at 13:10

shennan

11.8k5 gold badges52 silver badges94 bronze badges

3 Comments

Xtian Over a year ago

I have tried this as well, but it is not actually triggering a click. If i manually click on the link, the pop-up works. But for using either of these doesn't seem to do anything. I can't figure out why

shennan Over a year ago

which lightbox plugin are you using?

A. Wolff Over a year ago

@Xtian i'm quite sure element use timestamp ID, check your DOM. In this case, find an other selector than ID, e.g class or transversal selector

Collectives™ on Stack Overflow

jquery trigger or click not working?

2 Answers 2

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related