jQuery .on click fire additional click event

Question

I have a page that is loading ajax content in. In the ajax content I have a button that I want to click. upon clicking i want to click the .jb-close-button. I have tried another .on method, click method and trigger method.

$('body').on('click','button', relatedArticles);
function relatedArticles() {
    var whereto = $(this).attr('href');
    related = $('body').find(whereto);
    $('.jb-close-button').trigger();
    return false;
}

Okay, Sorry I removed a lot of extra code because it wasnt needed! sorry guys! Okay. In this situation I am trying to figure the a.one selector once button has been clicked. For whatever reason its not firing — user3637549, May 14 '14 at 16:49
Please don't make such crucial edits, otherwise all those people's answers seem totally incorrect. Rather add a subtitle with `*EDIT:` and than an additional info — Roko C. Buljan, May 14 '14 at 16:49
@user3637549 can we see your `a.one` click jQuery ? or even some http://jsBin.com with an example? — Roko C. Buljan, May 14 '14 at 16:50
@user3637549 That's the kind of information we needed in the first place. Short answer: You can't trigger a hyperlink click using JavaScript. Possible duplicate: http://stackoverflow.com/questions/7999806/jquery-how-to-trigger-click-event-on-href-element — Blazemonger, May 14 '14 at 16:57

score 4 · Answer 1 · answered May 14 '14 at 16:29

4

You need to specify what event to trigger

$('body').on('click','button', relatedArticles);
function relatedArticles() {
    var whereto = $(this).attr('href');
    related = $('body').find(whereto);
    $('.jb-close-button').trigger('click');
    return false;
}

answered May 14 '14 at 16:29

martynas

12,120
3
55
60

Event is still not firing. – user3637549 May 14 '14 at 16:30
It will be tough to do a jsFiddle because the content is AJAX based. Here is the full scenario. I have a article with a read more button, it popups a butterflyjs lightbox window that loads in the content via ajax from another html page. In the popup we have related articles with a read more button. The function that I need to write is when clicking that read more button for related articles I need to close the popup window and then find $whereto and click that ancor. – user3637549 May 14 '14 at 16:36

score 3 · Answer 2 · answered May 14 '14 at 16:28

3

You need to pass the click event that you want to trigger inside .trigger():

$('.jb-close-button').trigger('click');

answered May 14 '14 at 16:28

Felix

37,892
8
43
55

score 1 · Answer 3 · answered May 14 '14 at 16:28

1

this should work:

$('.jb-close-button').click();

answered May 14 '14 at 16:28

Ehsan Sajjad

61,834
16
105
160

score 1 · Answer 4 · answered May 14 '14 at 16:39

in your default click handler for .jb-close-button do like:

$('body').on('click', ".jb-close-button", function( e ) {

      e.preventDefault();  // Prevent default browser behavior
   // e.stopPropagation(); // Uncomment to prevent event bubble up the DOM tree

   console.log("Close Button Clicked!");

   // your CLOSE code here

});

Than you can do like:

function relatedArticles() {
    related = $('body').find( this.getAttribute('href') ); // Change var value
    $('.jb-close-button').click();                         // trigger click
}

$('body').on('click', '.button', relatedArticles); // .button needs a HREF attr!!

also try to be more specific with your selectors:

"body" do you have any other static element parent ID ?
"button" does that button have a class? use it! (I did.) And make sure it has a href attribute

@user3637549 I'm sorry your code does not works. Have you tried mine? Have you checked in console (F12) that you don't have any errors? — Roko C. Buljan, May 14 '14 at 16:47

jQuery .on click fire additional click event

4 Answers4