Javascript: как передать функцию со строковыми параметрами в качестве параметра в другую функцию

Мне нужно сделать что-то вроде этого:

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

Контекст этого вопроса заключается в том, что в onClick мне нужно вызвать функцию javascript, которая сделает вызов ajax на url, который я предоставляю. Он откроет модальный div с кнопками "ОК" и "Отмена".

До сих пор это прекрасно. Но тогда мне также нужно было сказать функции javascript другую функцию с другими параметрами и URL-адресами, которые будут вызываться, когда в новом div будет нажата кнопка OK. И еще один для кнопки Отмена.

Проблема в том, что я не могу правильно передать второй аргумент, так как он не убежит должным образом и дает мне ошибки JavaScript.

Я выполнил поиск других подобных Javascript-вопросов в SO, но не они, похоже, покрывают то, что мне нужно делать.

Кто-нибудь знает, как передать этот тип строковых параметров функции javascript? Или, может быть, есть еще одно лучшее решение передать эти вещи, о которых я не думал.

Заранее спасибо

Ответы

Ответ 1

Одним из способов было бы просто избежать кавычек правильно:

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

В этом случае, я думаю, лучший способ справиться с этим - обернуть два обработчика анонимными функциями:

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

И тогда вы можете называть их из myfunction следующим образом:

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

    if (okClicked)
    {
        onOK();
    }

    if (cancelClicked)
    {
        onCancel();
    }
}

Вероятно, это не будет выглядеть как myfunction, но вы получите общую идею. Дело в том, что если вы используете анонимные функции, у вас будет намного больше гибкости, и вы также сохраните свой код намного чище.

Ответ 2

Попробуйте следующее:

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

Затем вам просто нужно вызвать эти две функции, переданные в myfunction:

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

Ответ 3

Я, я бы сделал это примерно так:

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);  
}

Но тогда я также предположил бы привязать закрытие к пользовательскому подписанному событию. Вам нужно добавить некоторые детали к вопросу на самом деле, но first-class функции легко проходимы, и получение параметров к ним может быть выполнено любым числом способов. Я бы избегал передавать их как строковые метки, хотя косвенность подвержена ошибкам.