如何仅通过 HTML 调用函数内部函数

Question

我无法仅使用 HTML 访问函数内部的函数。 如何仅使用 HTML 调用 setLayout() 还是只能在 Javascript 中调用？

<button onclick="customize.setLayout('b.html');">Click Please</button>

Javascript:

 function customize() {
     function setLayout(text) {

        var selectedLayout = text;
        layout += selectedLayout;
        $.get(layout, function (data) {
            $("#layout-grid").html(data);
        });
    }
}

Answer 1

根本无法调用 setLayout。

在其他函数中定义的函数仅限于该函数。它们只能被该范围内的其他代码调用。

如果你想能够调用 customize.setLayout 那么你必须首先创建 customize （它可以是一个函数，但不需要是）然后你需要制作 setLayout 该对象的属性。

customize.setLayout = function setLayout(text) { /* yada yada */ };

Answer 2

在函数内调用函数的多种方式。首先，内部函数在您明确公开之前对外部不可见只有一种方法是：

function outerobj() {

    this.innerfunc = function () { alert("hello world"); }

}

这定义了一个对象，但目前没有实例。您需要先创建一个：

var o = new outerobj();
o.innerfunc();

另一种方法：

var outerobj = {

    innerfunc : function () { alert("hello world"); }

};

这将定义一个可以立即使用的对象 outerobj:

outerobj.innerfunc();

Answer 3

Simple answer: You can't call setLayout() with this setup anywhere!

原因是，setLayout() 在 customize() 之外不可见，甚至在其他 JavaScript 代码中也不可见，因为它是在 customize() 内部本地定义的，所以它具有本地范围仅在 customize() 内可用。就像其他人提到的，还有其他可能的方法...(^__^)

您可以通过 return 将其作为 customize() 的方法 return setLayout() 的响应，并在您的 HTML 中使用它，例如 customize().setLayout('b.html'); 例如

<button onclick="customize().setLayout('b.html');">Click Please</button>

JavaScript:

function customize() {

    var setLayout = function (text) {
        var selectedLayout = text;
        layout += selectedLayout;
        $.get(layout, function (data) {
            $("#layout-grid").html(data);
        });
    };

    return {
        setLayout: setLayout
    };

}

另一种方法

您还可以定义您的主函数，即 customize 为 Immediately-Invoked Function Expression (IIFE)。这样你就可以在 HTML 部分调用它的方法时省略括号。

<button onclick="customize.setLayout('b.html');">Click Please</button>

JavaScript

var customize = (function () {

    var setLayout = function (text) {
        var selectedLayout = text;
        layout += selectedLayout;
        $.get(layout, function (data) {
            $("#layout-grid").html(data);
        });
    };

    return {
        setLayout: setLayout
    };

})();

Answer 4

如果你非要这样做的话，可以定义setLayout然后调用它，像这样：

<script>
  function customize(text, CallSetLayout) {
    if (CallSetLayout) {
      (function setLayout(text) {
        //do something
        alert(text);
      })(text);
    }
  }

</script>

<button onclick="customize('sometext',true);">Click Please</button>

然后您可以决定是否要从外部定义和调用 setLayout

Answer 5

您需要将其视为对象和方法

<button onclick="customize().setLayout('b.html');">Click Please</button>

抱歉，我不得不编辑此代码以获得更多说明

function customize() {

     this.setLayout = function setLayout(text) {

        var selectedLayout = text;
        layout += selectedLayout;
        $.get(layout, function (data) {
            $("#layout-grid").html(data);
        });
    }
    return this;
}

如何仅通过 HTML 调用函数内部函数

How to call function inside function through only HTML

html

javascript

function

call

另一种方法