javascript - 将 JS 函数绑定(bind)到 razor 文件中另一个脚本文件中的复选框

Question

我有一个部分 Razor View ，其中包含一个文本框，例如 -

@Html.EditorFor(x => x.UnitsBought, new { @onchange = "script.updateUnitPrice(this);" } )

它是从主视图调用的，并且脚本的引用如下 -

$(document).ready(function () {
        let script = new UnitAllocationMaintScript();
        script.initialize();

脚本位于不同的 JS 文件中，例如 -

var UnitAllocationMaintScript = (function ($, app) {
"use strict";
var updateUnitPrice = function (element) {
....
}

但是当我更改 UnitsBought 文本框时，会出现错误 -

脚本未定义。

我应该如何调用该函数。

Answer 1

script 是在 $(document).ready() 处理函数中定义的，因此超出了 onchange 属性的范围在窗口下运行。

要解决此问题，您可以使用不显眼的 JS 而不是过时的 on* 属性来附加事件处理程序。试试这个:

@Html.EditorFor(x => x.UnitsBought, new { @class = "units-bought" } )

$(document).ready(function () {
  let script = new UnitAllocationMaintScript();
  script.initialize();

  $('.units-bought').change(function() {
    script.updateUnitPrice(this);
  });
});