将需要参数的匿名函数传递给另一个函数作为将分配给onclick的参数

我有一个function,我想在整个程序中重用。 基本上它是一个带有确认和取消按钮的引导对话框。 我设置了辅助函数来接受两个匿名函数,一个用于取消,一个用于确认。 我有一切工作,但我不知道如何在构建html时将其正确分配给onclick。 我想避免使用全局变量,但这是我能够使用它的唯一方法。

自定义function:

function confirmMessageBox(msg, cancelFunc, confirmFunc) { var html = ' 
'; $("#confirmMsgContainer").html(html); $('#ConfirmMsgModal').modal('show'); }

我必须这样做,onclick =“(’+ cancelFunc +’)()”>因为如果我这样做,onclick =“’+ cancelFunc()+’”>它显示为未定义。 目前的方法基本上只是打印匿名函数并将其分配给onclick(几乎就像我刚刚在onclick上输入了匿名函数)

这是我调用函数的地方:

  var transTypeHolder; $("input[name='transType']").click(function () { var tabLength = $('#SNToAddList tbody tr').length; if (tabLength == 0) { var selection = $(this).attr("id"); serialAllowableCheck(selection); resetSerialNumberCanvasAndHide(); $("#Location").val(""); $("#SerialNumber").val(""); } else { transTypeHolder = $(this).val(); var confirm = function () { var $radios = $('input:radio[name=transType]'); $radios.filter('[value='+transTypeHolder+']').prop('checked', true); resetSerialNumberCanvasAndHide(); $('#Location').val(''); $('#SerialNumber').val(''); }; var cancel = function () {}; confirmMessageBox("This is a test", cancel, confirm); return false; } }); 

有没有办法让一些变量传递给匿名函数而不使用我所拥有的全局变量“transTypeHolder”?

在我得到之前,“你为什么这样做?” 响应; Javascript不是我的强语,因为我使用的是ASP.NET MVC4。 我没有机会坐下来详细学习Javascript,我有点挑选它并搜索我需要的东西。 因此,如果有更好的解决方法,我愿意接受建设性的批评。

不要在HTML中进行事件处理程序分配。 如果您希望人们能够提供自己的function来取消和确认使用:

 function confirmMessageBox(msg, cancelFunc, confirmFunc) { var html = ' 
'; $("#confirmMsgContainer").html(html); $("#confirmMsgContainer").off('click', '.confirm').on('click', '.confirm', confirmFunc); $("#confirmMsgContainer").off('click', '.cancel').on('click', '.cancel', cancelFunc); $('#ConfirmMsgModal').modal('show'); }

请注意,我已经编辑了您用来删除onclick的HTML,并为每个按钮添加了一个类。 我也使用off来确保删除任何以前添加的事件处理程序。

至于在不使用全局的情况下将变量传递给confirm函数,请使用闭包:

 var transTypeHolder = $(this).val(); var confirm = (function (typeHolder) { return function () { var $radios = $('input:radio[name=transType]'); $radios.filter('[value='+typeHolder+']').prop('checked', true); resetSerialNumberCanvasAndHide(); $('#Location').val(''); $('#SerialNumber').val(''); }; })(transTypeHolder); 

这告诉JavaScript创建一个函数,它返回一个执行你想要它做的事情的函数。 那个“函数创建者”接受你想要保留的变量,允许它在其他地方使用。

现在,我还没有对此进行测试,因此您可能会在将来进行一些调试,但希望它能为您提供一个起点。

您应该能够通过在生成的名称下从全局上下文访问该函数来实现它(如果您有多个实例的框,则可以是多个),如下所示:

 function confirmMessageBox(msg, cancelFunc, confirmFunc) { window['generatedCancelFunctionName1'] = cancelFunc; window['generatedConfirmFunctionName1'] = confirmFunc; var html = ' 
'; $("#confirmMsgContainer").html(html); $('#ConfirmMsgModal').modal('show'); }

这样您就没有义务公开function代码。 您还可以为元素设置id属性,并在第二部分中设置jquery click()函数(但是在设置单击之前需要创建html)