Click a button element on page load

I'm trying to auto-click a button to initiate a function when the html page loads. I've tried document.getElementById('watchButton').click and it doesn't seem to work, the button is not clicked. Any suggestions?

<div class="content">
        <div class="action-area ch30">
            <button class="button dh" id="watchButton">Start Geolocation Watch</button>
            <button class="button dh" id="refreshButton" >Refresh Geolocation</button>
        </div>

The javascript:

    run:function() {
    var that = this;
    document.getElementById("watchButton").addEventListener("click", function() {
        that._handleWatch.apply(that, arguments);
    }, false); 
    document.getElementById("refreshButton").addEventListener("click", function() {
        that._handleRefresh.apply(that, arguments);
    }, false);
},

Thanks!

Answers:

Answer

I'd put it inside document.ready (so it doesn't fire until the DOM loads) and use jQuery syntax:

$(function() {
    $('#watchButton').click();
});

http://jsfiddle.net/isherwood/kVJVe/

Here's the same fiddle using jQuery syntax: http://jsfiddle.net/isherwood/kVJVe/4

That said, why not just name your function and call it directly?

Answer

It would be click() not click

document.getElementById("watchButton").click();

You would need to call it onload or after the function has run

Answer

try trigger

<script>
$(document).ready(function() {
   $("#watchButton").trigger('click');
});
</script>
Answer
document.getElementById("studyOne").click();
$("#studyOne").trigger('click');

Put this in onload function. It worked for me.

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.