it-swarm.com.de

Wie kann ich in JavaScript Argumente an anonyme Funktionen übergeben?

Ich versuche herauszufinden, wie Argumente in JavaScript an eine anonyme Funktion übergeben werden.

Schauen Sie sich diesen Beispielcode an und ich denke, Sie werden sehen, was ich meine:

<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>

Beim Anklicken der Schaltfläche erscheint die Meldung: it's working sollte erscheinen. Die Variable myMessage in der anonymen Funktion ist jedoch null.

jQuery verwendet viele anonyme Funktionen. Wie lässt sich dieses Argument am besten weitergeben?

72
hakksor

Ihr spezifischer Fall kann einfach so korrigiert werden, dass er funktioniert:

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

Dieses Beispiel funktioniert, da die anonyme Funktion, die als Handler für ein Element erstellt und zugewiesen wurde, Zugriff auf Variablen hat, die in dem Kontext definiert wurden, in dem sie erstellt wurde.

Für den Datensatz erwartet ein Handler (den Sie durch Festlegen der Eigenschaft onxxx zuweisen), dass ein einzelnes Argument verwendet wird, bei dem es sich um ein Ereignisobjekt handelt, das vom DOM übergeben wird, und Sie können die Übergabe eines anderen Arguments nicht erzwingen

69
Sergey Ilinsky

Was Sie getan haben, funktioniert nicht, weil Sie ein Ereignis an eine Funktion binden. Als solches ist es das Ereignis, das die Parameter definiert, die beim Auslösen des Ereignisses aufgerufen werden (d. H. JavaScript kennt Ihren Parameter in der Funktion, auf die Sie klicken müssen, nicht und kann ihm nichts übergeben).

Sie könnten dies jedoch tun:

<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>
24
jmcd

Im Folgenden finden Sie eine Methode zum Verwenden von Abschlüssen, um das Problem zu beheben, auf das Sie sich beziehen. Es berücksichtigt auch die Tatsache, dass sich die Nachricht im Laufe der Zeit ändern kann, ohne die Bindung zu beeinträchtigen. Und es verwendet jQuery, um prägnant zu sein.

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

Durch Entfernen des Parameters aus der anonymen Funktion wird im Körper verfügbar.

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

Für weitere Informationen suchen Sie nach 'Javascript Verschlüssen'

9
Aleris

Ereignishandler erwarten einen Parameter, nämlich das Ereignis, das ausgelöst wurde. Sie benennen das zufällig in "myMessage" um und alarmieren daher das Ereignisobjekt und nicht Ihre Nachricht.

Ein Abschluss kann es Ihnen ermöglichen, auf die Variable zu verweisen, die Sie außerhalb der Funktion definiert haben. Wenn Sie jedoch Jquery verwenden, möchten Sie möglicherweise die ereignisspezifische API überprüfen, z.

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

Hier haben Sie die Möglichkeit, Ihre eigenen Daten weiterzugeben.

5
wioota
<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>

Dies funktioniert in meiner Testsuite, die alles von IE6 + enthält. Die anonyme Funktion kennt das Objekt, zu dem sie gehört, daher können Sie Daten übergeben mit das Objekt, das es aufruft (in diesem Fall myButton).

3
Un Known

Beispiel:

<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>
1
Shadow2531

Die Delegierten:

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

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

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

So führen Sie die Funktion displayMessage aus:

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

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

Sie haben eine neue anonyme Funktion erstellt, die einen einzelnen Parameter verwendet, der dann der lokalen Variablen myMessage in der Funktion zugewiesen wird. Da tatsächlich keine Argumente übergeben werden und Argumente, denen kein Wert übergeben wird, zu Null werden, macht Ihre Funktion lediglich einen Alert (Null).

Wenn du es so schreibst

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

Es wird funktionieren, aber ich weiß nicht, ob das Ihre Fragen beantwortet.

0
tpower