HTML onload无法正常工作

Question

我正在尝试使用html onload事件来触发javascript,但是无法正常工作.原始代码是:

HTML:

<div id='map' onload="generateMap.createMap();"></div>

JS:

var generateMap = function(){
return{
    createMap: function(){
        console.log(this.attr('id'));
        element = this.attr('id');
        navigator.geolocation.getCurrentPosition(initialize);
    }
};

}

为了测试,我将html更改为:

<div id='map' onload="alert('test');"></div>

谁能告诉我为什么没有什么工作？

Answer 1

首先,该onload属性对div标记无效.您很可能打算将其onload放入body标签中.

不幸的是,这不是唯一的问题.

在onLoad你的引用中generateMap,好像它是一个带方法的对象createMap.然而,这种情况并非如此.您已分配generateMap匿名功能.

要使代码正常工作,generateMap需要使用方法作为对象createMap.

您只需要将其设置为对象:

var generateMap = {
    createMap: function(){
        console.log(this.attr('id'));
        element = this.attr('id');
        navigator.geolocation.getCurrentPosition(initialize);
    }
};

或者,如果由于某种原因需要保留匿名函数,可以使用立即执行的函数:

var generateMap = (function(){
    return {
        createMap: function(){
            console.log(this.attr('id'));
            element = this.attr('id');
            navigator.geolocation.getCurrentPosition(initialize);
    }
})();