Run a click event when page is load using jquery / javascript

Question

I already search this functionality to this url : How to trigger click on page load? but it's not working in my site.

Well, I have a page where a popup box appear when I click on a "project" link. here is the code :

$(".project").click(function() {
    $("#first, #second, .allContactsContent").slideUp("slow", function() {
    $("#third").slideDown("slow");  
    $("#contacts, #showSearchResult, #all_projects").hide();            
    });
});

I want to load this "project" click event when page is load, how can I do this ? What I am trying now is following :

<script type="text/javascript">  
$("document").ready(function() {
setTimeout(function() {
    $(".project").trigger('click');
    alert(1);
},10);
});
</script>

Shouldn't it be `$(document)` without the `"`s? – Jakub Kotrs Aug 31 '15 at 18:07 — Jakub Kotrs, Aug 31 '15 at 18:07
@creativeartbd sorry bit late .. Good catch JakubMichálek – Krsna Kishore Aug 31 '15 at 18:16 — Krsna Kishore, Aug 31 '15 at 18:16

score 0 · Answer 1 · answered Aug 31 '15 at 18:15

0

here is a working fiddle

HTML

 <div class="project"> </div>

answered Aug 31 '15 at 18:15

Krsna Kishore

8,233
4
32
48

please add the description , instead of posting link to fiddle. – Runner Jan 11 '21 at 06:22
@Runner i wanted to make it runnable one, and the fiddle is working fine. Just want to present a runnable solution. Thanks for your input and time – Krsna Kishore Jan 11 '21 at 09:14

score 0 · Answer 2 · answered Aug 31 '15 at 18:50

You don't want a trigger a "click" event when nobody has clicked on anything. The event handler code should be refactored so a click event is not required:

function showAndHideStuff() {
    $("#first, #second, .allContactsContent").slideUp("slow", function() {
        $("#third").slideDown("slow");  
        $("#contacts, #showSearchResult, #all_projects").hide();            
    });
}

Then pass the function in as a ready event handler, as well as using that function as the click handler:

$(document)
    .ready(showAndHideStuff)
    .ready(function() {
        $(".project").click(showAndHideStuff);
    });

Run a click event when page is load using jquery / javascript

2 Answers2