CODEWITHSUNDEEP
javascriptjquery
Claudio Delgado
Claudio Delgado

Reputation: 2349

Programmatically click on a link using jQuery on page load

I have a link that is on the page and I want to click it programmatically when the page loads.

Something like this:

$(document).ready(function () {

   // code to make the page think $('a.tagcloud-link') is clicked
});

The link is an AJAX call that displays the popular tags in Wordpress backend.

The function cannot easily be edited as it's dependent on many things.

So I want to trigger the AJAX link that calls the most popular tags on page load.

This will solve all my problems if it works.

That link is $('a.tagcloud-link')

Please, please help me on this I've spent hours pulling my hair out trying and failing to do this. Thank you.

Upvotes: 6

Views: 24062

Answers (11)

Bruno Reis Silvino
Bruno Reis Silvino

Reputation: 39

Maybe the way you was using to access the element be mixing jquery syntax with javascript. I'v got this problem too, but I was trying to access a element by wrong way.

It was like this

$(document).ready(function(e){
        alert(location.hash);
        if (location.hash == "#22") {
            $("gallery div a")[1].click(); //without #
        };
    })

but should be like this

$(document).ready(function(e){
        alert(location.hash);
        if (location.hash == "#22") {
            $("#gallery div a")[1].click(); //with #, cause I was using an ID
        };
    })

And works :)

Upvotes: 0

fishpie
fishpie

Reputation: 1

function my_admin_head(){
echo 
'<script type="text/javascript">
    jQuery(function( $ ){ 
        $(\'a.tagcloud-link\').each( function(){
            tagBox.get( $(this).attr(\'id\') );
            $(this).unbind().click(function(){
                $(this).siblings(\'.the-tagcloud\').toggle();
                return false;
            });
        return false;
    });
});
</script>';
}
add_action('admin_head', 'my_admin_head');

Maybe it can help somebody.

Upvotes: 0

Claudio Delgado
Claudio Delgado

Reputation: 2349

None of these helped. I fixed it myself by bypassing the link and executing it on load.

Upvotes: 0

Heart
Heart

Reputation: 518

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("a#tobeclicked").click(function () {
// if it has to be href
var tohref = $(this).attr("href");
alert(tohref);
window.location=tohref;


// else you want add some functions

$("#mydiv").fadeIn();

});
$("a#tobeclicked").trigger('click');
});
</script>
<a id="tobeclicked" href="http://www.google.com">Go!</a>
<div id="mydiv" style="display:none;">Stroam</div>

Upvotes: 3

Jim
Jim

Reputation: 1294

To be honest with you, I think everyone else here is right and I think the question is framed wrong. But heres my attempt and I think all I did was just frame it a little different. Just trying to help.

document.addEventListener("DOMContentLoaded", function() {
    EventL();
});

// global
var tagLoad = false;

function eventL() {
    $('a.tagcloud-link').on('click', function() {
       tagLoad = true;
    });

    // you can repurpose this, its for page refresh right now. but
    // I think it helps with your general idea?
    $(window).load(function(){ 
       init();
    });
}

function init () {
    if (tagLoad == true) {
         // Load your tags.
    }
}

Upvotes: 1

nnnnnn
nnnnnn

Reputation: 150030

Try this:

$('a.tagcloud-link')[0].click();

Using [0] gets a reference to the first DOM object in the jQuery object so this calls the DOM object's (non-jQuery) .click() method which will cause the navigation to the link's specified href.

Using jQuery's .click() method would call any click handler that you'd bound to the element, but won't cause the default behaviour to actually follow the link.

Really simple demo: http://jsfiddle.net/mtBav/

Upvotes: 8

anche
anche

Reputation: 2884

$(function() {
     $('a.tagcloud-link').on('click', function() {
          // execute code here
     });
});

This is proper use of jQuery.

Upvotes: 1

Sushanth --
Sushanth --

Reputation: 55750

Try 

$('a.tagcloud-link').click();

OR 

$('a.tagcloud-link').trigger('click')

Upvotes: 1

Jonas T
Jonas T

Reputation: 3077

If you have already binded $('a.tagcloud-link').click(), it will call that function. The following code should work.

$(document).ready(function () {
 $('a.tagcloud-link').click();
});

But if you want to open the link in its href, you need to use window.location.

Upvotes: 1

jAndy
jAndy

Reputation: 236022

If that element owns an event handler which was bound with jQuery too, you might just call .trigger( 'click' ) or short .click();

$(function() {
    $('a.tagcloud-link').click();
});

Of course, at the time when you invoke .click(), that event handler must be bound already.

Upvotes: 4

Reflective
Reflective

Reputation: 3917

If I correctly understood the question: 

   $('a.tagcloud-link').click();

Upvotes: 1

Related Questions