如何在JavaScript中将参数传递给匿名函数？

我试图弄清楚如何将参数传递给JavaScript中的匿名函数。

查看此示例代码，我想您会明白我的意思的：

<input type="button" value="Click me" id="myButton" />

<script type="text/javascript">
    var myButton = document.getElementById("myButton");
    var myMessage = "it's working";
    myButton.onclick = function(myMessage) { alert(myMessage); };
</script>

单击按钮时，it's working将出现消息：。但是，myMessage匿名函数中的变量为null。

jQuery使用许多匿名函数，传递该参数的最佳方法是什么？

您的具体情况可以简单地纠正为有效：

<script type="text/javascript">
  var myButton = document.getElementById("myButton");
  var myMessage = "it's working";
  myButton.onclick = function() { alert(myMessage); };
</script>

此示例将起作用，因为创建并指定为元素处理程序的匿名函数将有权访问在其创建上下文中定义的变量。

为了记录起见，处理程序（通过设置onxxx属性分配的处理程序）期望使用单个参数作为DOM正在传递的事件对象，并且您不能在其中强制传递其他参数

您完成的操作不起作用，因为您将事件绑定到函数。因此，事件定义了引发事件时将调用的参数（即，JavaScript不知道您绑定到onclick的函数中的参数，因此无法向其中传递任何内容）。

您可以这样做：

<input type="button" value="Click me" id="myButton"/>

<script type="text/javascript">

    var myButton = document.getElementById("myButton");

    var myMessage = "it's working";

    var myDelegate = function(message) {
        alert(message);
    }

    myButton.onclick = function() { 
        myDelegate(myMessage);
    };

</script>

以下是使用闭包来解决您所引用的问题的方法。它还考虑了以下事实：在不影响绑定的情况下可以随时间更改消息。并且它使用jQuery简洁。

var msg = (function(message){
  var _message = message;
  return {
    say:function(){alert(_message)},
    change:function(message){_message = message}
  };
})("My Message");
$("#myButton").click(msg.say);

通过从匿名函数中删除该参数，将在正文中可用。

    myButton.onclick = function() { alert(myMessage); };

有关更多信息，请搜索“ javascript闭包”

事件处理程序期望一个参数，它是触发的事件。您碰巧将其重命名为“ myMessage”，因此您在警告事件对象而不是消息。

闭包可以允许您引用在函数外部定义的变量，但是，如果您使用的是Jquery，则可能需要查看其事件特定的API，例如

http://docs.jquery.com/Events/bind#typedatafn

这有一个传递您自己的数据的选项。

<input type="button" value="Click me" id="myButton" />

<script type="text/javascript">
    var myButton = document.getElementById("myButton");

    myButton.myMessage = "it's working";

    myButton.onclick = function() { alert(this.myMessage); };


</script>

这适用于我的测试套件，其中包括IE6 +的所有功能。匿名函数知道它所属的对象，因此您可以与调用它的对象（在本例中为myButton）一起传递数据。

例：

<input type="button" value="Click me" id="myButton">
<script>
    var myButton = document.getElementById("myButton");
    var test = "zipzambam";
    myButton.onclick = function(eventObject) {
        if (!eventObject) {
            eventObject = window.event;
        }
        if (!eventObject.target) {
            eventObject.target = eventObject.srcElement;
        }
        alert(eventObject.target);
        alert(test);
    };
    (function(myMessage) {
        alert(myMessage);
    })("Hello");
</script>

代表们：

function displayMessage(message, f)
{
    f(message); // execute function "f" with variable "message"
}

function alerter(message)
{
    alert(message);
}

function writer(message)
{
    document.write(message);
}

运行displayMessage函数：

function runDelegate()
{
    displayMessage("Hello World!", alerter); // alert message

    displayMessage("Hello World!", writer); // write message to DOM
}

完成的工作是创建一个新的匿名函数，该函数使用一个参数，然后将其分配给该函数内的局部变量myMessage。由于实际上没有传递任何参数，而没有传递任何值的参数变为null，因此您的函数只会发出alert（null）。

如果你这样写

myButton.onclick = function() { alert(myMessage); };

它将起作用，但是我不知道这是否能回答您的问题。