CODEWITHSUNDEEP
javascriptjqueryclick
Buboon
Buboon

Reputation: 405

How to call click() for element?

I am using a lightgallery plugin where the click event is defined as:

$(document).on('click', 'a[rel^=lightbox], area[rel^=lightbox], a[data-lightbox], area[data-lightbox]', function(event) {
    self.start($(event.currentTarget));
    event.preventDefault();
});

However, when I try to call the event like this:

$(".catalog-content a[data-lightbox='test']").first().trigger('click');

... it doesn't seem to work. What am I doing wrong? How can I trigger the click event?

Example jsFiddle

Upvotes: 5

Views: 186

Answers (3)

Casey Falk
Casey Falk

Reputation: 2667

To "simulate a click" using jQuery, you are correct in that you can just use the .trigger(...) method:

$(".myClass").trigger("click");

The real issue is that you are "clicking" something that doesn't exist. There is no ".catalog-content a[data-lightbox='test' element. As Velthune suggests, you can add the .catalog-content class to the div container to fix this; however, note that there also is no a[data-lightbox='test'] element.

Instead, in your Fiddle you define the following:

<a href="http://..." data-lightbox="350xi" id="test">
    something
</a>

So you actually just want to click on the first a element with a data-lightbox attribute of "350xi":

$("a[data-lightbox='350xi']").first().trigger("click");

Upvotes: 1

Luca Davanzo
Luca Davanzo

Reputation: 21520

Your code in fiddle can't work.

1) Either use a different selector as Devendra suggested.
2) Or add the .catalog-content class to the div container:

<div class="cars-container catalog-content">

Fiddle

3) Both Devendra and I can't understand.

Upvotes: 0

Devendra Soni
Devendra Soni

Reputation: 1934

Hey i have gone through the jsfiddle and updated it please go through it..

$(document).ready(function() { 
    $(".cars-container a[rel!='']").click(function() {
        var rel = $(this).attr("rel"); 
        $(".cars-container a[data-lightbox='" + rel + "']:first").trigger('click');
    });
});

click below jsfiddle link to see the working example:- http://jsfiddle.net/wHJ8E/3/

Upvotes: 0

Related Questions