javascript - Click a button element on page load

Question

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!

Answer 1

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?