expandTitle(...) 不是函数

Question

我尝试重用这部分，但控制台一直记录此错误。我已经确保我在函数名称中没有任何拼写错误。

$(document).ready(function () {
    ...

    function expandTitle(selector) {
        let param = $(selector),
            paramOverlay = $(selector + '>.overlay');
        let overlayHeight = getOuterHeight(param),
            overlayWidth = getOuterWidth(param);

        param.css({
            'height': overlayHeight
        });

        param.hover(
            function () {
                paramOverlay.animate({
                    'width': overlayWidth
                });
            },
            function () {
                paramOverlay.animate({
                    'width': 0
                });
            }
        );
    };

    ...

    (function () {
        expandTitle('#viewPointTitle>h1')();
    })();
});

提前致谢:D

Answer 1

您只需要使用 expandTitle('#viewPointTitle>h1'); 而不是 expandTitle('#viewPointTitle>h1')();，因为添加 () 意味着第一个函数 expandTitle return 是另一个函数，然后是returned 函数被立即调用。并且由于您没有 return expandTitle 中的任何函数，因此删除 ().

$(document).ready(function () {
    function expandTitle(selector) {
       console.log(selector);
    };

    (function () {
        expandTitle('#viewPointTitle>h1');
    })();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

这就是当您 return 来自被调用函数的函数时 () 的工作方式：

$(document).ready(function () {
    function expandTitle(selector) {
      return function test(){
       console.log('inner function log');
      }
    };

    (function () {
        expandTitle('#viewPointTitle>h1')();
    })();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

expandTitle(...) 不是函数

expandTitle(...) is not a function

jquery

code-reuse