Trigger click event to dynamically added link on href using jquery

Question

I am dynamically creating the link on anchor tag through jquery, I want to trigger click event as soon as link gets attached to href, but in my case click event didn't get triggered.

JQuery:

$("#refShare").click(function(e){
    jQuery.ajax({
        url: base_url+"create-refer",
        cache : false,
        dataType: 'json',
        data: { email:email },  
        type:'post',
        success:function(response){
            jQuery('li#refShare a:first').attr("href", 'https://www.xyzLink.com/'+response.link);
            jQuery('li#refShare a:first').attr("target", 'blank');
            jQuery('li#refShare a:first').click();
       }); 
});

HTML:

<ul>
<li id="refShare">
<a href="" id="share-facebook">
<i class="fa fa-facebook fa-2x" aria-hidden="true"></i>
</a>
</li>
<li>
    ....
</li>
    .....
</ul>

Sorry, my first comment was misleading (I deleted it). Do you reach the success callback? Can you `console.log(response)` ? — John Archer, Mar 04 '20 at 12:39
yes i'm getting link and it is getting attached but click event is not triggered as soon as link is attached — user3653474, Mar 04 '20 at 12:41
Does it work if you don't set the target (to blank)? Because of popup blockers of your browser. — John Archer, Mar 04 '20 at 12:43
or you can just do window.open('https://www.xyzLink.com/'+response.link, '_blank'); — mchev, Mar 04 '20 at 12:43
can you try `$("a").trigger("click")` as described here https://stackoverflow.com/a/5811251/912046 — el-teedee, Mar 04 '20 at 12:44
I think this could be a security behaviour of the browser. Probably the window.open() way is the way to go. — John Archer, Mar 04 '20 at 13:04

Kelsnare · Answer 1 · 2020-03-04T13:07:59.457

1

Try trigger

$("#refShare").trigger("click")

edited Mar 04 '20 at 13:07

answered Mar 04 '20 at 12:43

Kelsnare

635
5
12

Thanks but it is not working i tried this window.open('xyzLink.com/'+response.link, '_blank'); it is working – user3653474 Mar 04 '20 at 12:47
1

I hope you tried with the correct selector `$('li#refShare a:first').trigger("click");` – Kelsnare Mar 04 '20 at 12:57
[This answer](https://stackoverflow.com/questions/7999806/how-to-trigger-click-event-on-href-element) might explain a bit. – Kelsnare Mar 04 '20 at 13:00
1

@Kelsnare It is not true that `click()` does not trigger. In your linked documentation there is this: `Description: Bind an event handler to the "click" JavaScript event, or trigger that event on an element.` – John Archer Mar 04 '20 at 13:03

Desi boys · Answer 2 · 2020-03-05T07:30:18.537

0

You need to choose the right element which can be clickable and your goal to redirect to somewhere else automatically(where human intervention does not require) can be achieved by using 'trigger' function.

you can do :

$('#share-facebook').trigger('click');

For further details/documentation about jquery 'trigger' function, you can check this url: .trigger()

edited Mar 05 '20 at 07:30

answered Mar 04 '20 at 12:46

Desi boys

29
3

Thanks but it is not working i tried this window.open('xyzLink.com/'+response.link, '_blank'); it is working – user3653474 Mar 04 '20 at 12:47
2

Please add some explanation to your answer by editing it, such that others can learn from it – Nico Haase Mar 04 '20 at 13:46

score 0 · Answer 3 · answered Mar 04 '20 at 12:49

0

Do you want an auto click or manual click?

If you want an auto => jQuery('li#refShare a:first').trigger( "click" ); Otherwise manually means assign one id to this href and make it click. jQuery('li#refShare a:first').attr("id", 'some_id');

outside Ajax

  jQuery('#some_id').on('click','#some_id', function() {
    //do it your stuff...
 });

answered Mar 04 '20 at 12:49

Balamurugan A.

37
4

i want auto click i tried your code but it is not working – user3653474 Mar 04 '20 at 12:53
Best you analyze the jQuery.trigger(); this going to help you. – Balamurugan A. Mar 04 '20 at 13:04

score 0 · Answer 4 · answered Mar 04 '20 at 13:12

Try this

jQuery(document).ready(function(){


     setTimeout(function(){ 


      alert("Hello"); 

      jQuery('#Link_xyz').attr("href", 'https://github.com/gauravin213');
         jQuery('#Link_xyz').attr("target", 'blank');
         jQuery('#Link_xyz').click();



     }, 3000);


     jQuery(document).on('click', '#Link_xyz', function(){  

      var target = jQuery(this);

      var url = target.attr('href'); alert("click: "+url); 

      //window.open(url, '_blank');

            window.location.href = url;
     });

     

    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
 <a id="Link_xyz" href="">Link</a>
</div>

Trigger click event to dynamically added link on href using jquery

4 Answers4