Question

我知道这是一个重复的主题，但这个主题是不同的，因为我使用非常简单的例子。我有一个像这样的JavaScript函数：

(function myfunction($){
    function a(){
        alert("A section"); 
    }
    function b(){
        alert("B section")
    }
})();

我想创建一个HTML按钮，它调用函数A和函数B.我该怎么做？

Answer 1

通过在闭包之外声明名称使它们全局化，然后在闭包中分配它们。

var a, b;
(function myfunction($){
    a = function() {
        alert("A section"); 
    }
    b = function() {
        alert("B section")
    }
})();

您可以通过将它们包装在对象中来减少对全局命名空间的污染：

var myfuns = (function myfunction($) {
                 return { a: function() {alert("A section");},
                          b: function() {alert("B section");}
                        };
              })();

然后拨打myfuns.a和myfuns.b。

Answer 2

您可以创建具有这些功能的对象，并调用以下函数：

myFunctions = {

  a : function(){ alert("A section"); },
  b : function(){ alert("B section"); }

}

然后像下面这样打电话给他们：

myFunctions.a();
myFunctions.b();

这是检查它的jsfiddle。

<强>更新

作为对您的评论的回答，这是一个更新的jsfiddle，用于向您展示HTML的工作原理。

Answer 3

在闭包中将函数赋值给全局变量是一种方法。其他方法是遵循。

(function myfunction($){
    $("#button1").click(function {
        alert("A section"); 
    });
    $("#button2").click(function {
        alert("B section"); 
    });
})(jQuery);

这不会破坏您的全球范围。并为您的按钮绑定点击事件。

何时不使用jQuery

(function myfunction($){
    var button1 = getElementById("idOfButton1");
    button1.onclick = function {
        alert("A section"); 
    };
    var button2 = getElementById("idOfButton2");
    button1.onclick = function {
        alert("B section"); 
    };
})();

Answer 4

您可以先创建变量，然后将其公开给全局上下文：

(function myfunction($){
    var global = {
        a: function(){
            alert("A section");
        },
        b: function(){
            alert("B section")
        }
    };

    window.global = global;
})();
global.a();
global.b();

通过HTML调用嵌套JavaScript函数（简单）

4 个答案: