Javascript: Wie eine Funktion mit String-Parameter als Parameter an eine andere Funktion

Question

ich so etwas wie dies muss passieren tun:

<input type="button" value="click" id="mybtn" 
onclick="myfunction('/myController/myAction', 
        'myfuncionOnOK('/myController2/myAction2', 
            'myParameter2');', 
        'myfuncionOnCancel('/myController3/myAction3', 
            'myParameter3');');" /> 

Der Kontext dieser Frage ist, dass auf dem onClick Ich brauche einen Javascript anrufen Funktion, die einen Ajax-Aufruf an die von mir angegebene URL macht. Es öffnet sich ein Modal Div mit OK und Abbrechen-Tasten.

Bis hier ist es in Ordnung. Aber dann musste ich auch der JavaScript-Funktion eine andere Funktion mit anderen Parametern und URLs geben, die aufgerufen werden, wenn auf eine OK-Schaltfläche im neuen div geklickt wird. Und noch eine für die Schaltfläche Abbrechen.

Das Problem ist, ich kann nicht das zweite Argument richtig übergeben, da es nicht richtig entkommen und gibt mir Javascript-Fehler.

Ich habe eine Suche nach anderen ähnlichen Javascript-Fragen in SO gemacht, aber keine von ihnen scheint zu decken, was ich tun muss.

Jeder weiß, wie ich diese Art von String-Parameter an die JavaScript-Funktion übergeben könnte? Oder vielleicht gibt es eine andere bessere Lösung, Dinge weiterzugeben, an die ich nicht gedacht habe.

Vielen Dank im Voraus

Answer 1

Eine Möglichkeit wäre, nur die Zitate zu entkommen richtig:

<input type="button" value="click" id="mybtn" 
     onclick="myfunction('/myController/myAction', 
       'myfuncionOnOK(\'/myController2/myAction2\', 
        \'myParameter2\');', 
       'myfuncionOnCancel(\'/myController3/myAction3\', 
        \'myParameter3\');');"> 

In diesem Fall aber ich glaube, ein besserer Weg, dies zu umgehen würde die beiden Handler in anonymen Funktionen zu wickeln sein:

<input type="button" value="click" id="mybtn" 
     onclick="myfunction('/myController/myAction', 
       function() { myfuncionOnOK('/myController2/myAction2', 
          'myParameter2'); }, 
       function() { myfuncionOnCancel('/myController3/myAction3', 
          'myParameter3'); });"> 

Und dann könnte man sie von innen myfunction wie folgt aufrufen:

function myfunction(url, onOK, onCancel) 
{ 
    // Do whatever myfunction would normally do... 

    if (okClicked) 
    { 
     onOK(); 
    } 

    if (cancelClicked) 
    { 
     onCancel(); 
    } 
} 

Das ist wahrscheinlich nicht, was myfunction tatsächlich aussehen würde, aber Sie bekommen die allgemeine Idee. Der Punkt ist, wenn Sie anonyme Funktionen verwenden, haben Sie viel mehr Flexibilität, und Sie behalten Ihren Code auch viel sauberer.

Answer 2

Me, würde ich es so etwas tun:

HTML:

onclick="myfunction({path:'/myController/myAction', ok:myfunctionOnOk, okArgs:['/myController2/myAction2','myParameter2'], cancel:myfunctionOnCancel, cancelArgs:['/myController3/myAction3','myParameter3']);" 

JS:

function myfunction(params) 
{ 
    var path = params.path; 

    /* do stuff */ 

    // on ok condition 
    params.ok(params.okArgs); 

    // on cancel condition 
    params.cancel(params.cancelArgs); 
} 

aber ich würde dann auch wahrscheinlich eine Bindung an ein benutzerdefiniertes abonniertes Ereignis binden. Sie müssen wirklich einige Details zu der Frage hinzufügen, aber first-class Funktionen sind leicht passierbar und bekommen params zu ihnen kann eine beliebige Anzahl von Möglichkeiten. Ich würde vermeiden, sie als String-Etiketten obwohl, die Indirektion ist fehleranfällig.

Answer 3

Try this:

onclick="myfunction(
    '/myController/myAction', 
    function(){myfuncionOnOK('/myController2/myAction2','myParameter2');}, 
    function(){myfuncionOnCancel('/myController3/myAction3','myParameter3');} 
);" 

Dann brauchen Sie nur diese beiden Funktionen zu myfunction geben rufen:

function myfunction(url, f1, f2) { 
    // … 
    f1(); 
    f2(); 
}