Question

我有以下javascript代码：

var FOO = FOO || {};

FOO.Main = (function() {

    function init() {
             // do some not relevant stuff
    }

    // User interaction
    function mouseOver() {
        console.log("OVER");
    }

    function mouseOut() {
        console.log("OUT");
    }

    init();
})();

这就在html上：

<div id="logo-container" onmouseover="NARDOVE.mouseOver();" onmouseout="NARDOVE.Main.mouseOut();">
        <div id="layer-1">
            <canvas id="logo-canvas"></canvas>
            <script type="text/javascript" src="js/labs-logo.js"></script>
    </div>
</div>

但我收到以下错误：

未捕获的TypeError：对象＃没有方法'mouseOver'（索引）：23
未捕获的TypeError：无法调用未定义的方法'mouseOut'

我知道我调用的方法有所不同，但这只是我测试，任何想法如何使用div内联调用调用鼠标方法？

Answer 1

问题在于您定义命名空间的方式。您将匿名函数调用的结果分配给FOO.Main，但您的匿名函数不会返回任何内容。

您可以通过返回包含您希望通过FOO公开公开的方法和属性的对象来解决此问题。主持人：

var FOO = FOO || {};

FOO.Main = (function() {
    function init() {
             // do some not relevant stuff
    }

    // User interaction
    function mouseOver() {
        console.log("OVER");
    }

    function mouseOut() {
        console.log("OUT");
    }

    init();

    return {
        "mouseOver": mouseOver,            
        "mouseOut": mouseOut
    };
})();

然后您可以像这样调用mouseOver / mouseOut函数：

FOO.Main.mouseOver();
FOO.Main.mouseOut();

如何从命名空间内的函数调用div的onmouseover事件？

1 个答案: