javascript - 包含 Kendo Grid 事件的外部 Javascript 文件

Question

是否有从外部 Javascript 文件读取 Kendo 事件的正确方法？

在我看来，.cshtml

@(Html.Kendo().Grid<Model>()
        .Name("EmployeeGrid")
        .Columns(cols => { })
        .Events(evt => evt.DataBound("afterGridLoaded"))
        .DataSource(dataSource => dataSource.Ajax()
                                    .Batch(true)
                                    .PageSize(10)
                                    .Read(read => read.Action("GetEmployeeList", "EmployeeDetail"))
                                   )
      )

“afterGridLoaded”位于页面顶部加载的外部 Javascript 中。

外部 JavaScript 文件 -

$(function () {
  function afterGridLoaded(e) {
  $(".k-button.xxx").click(function () {
    debugger;
    var idEmployee = $(this).attr('tag');
    myJsFunc(idEmployee);
    });
  }
});

Javascript 的调用方式 - 这是在页面顶部完成的

@section scripts
{
    <script src="~/Scripts/Views/EmployeeDetail/EmployeeList.js" ></script>    
}

外部 Javascript 文件已加载，正如我在 Chrome 的 DEV 工具中网络选项卡下看到的那样，

当我尝试加载页面时，我在控制台上收到以下错误消息，该消息阻止页面进一步加载，

有没有办法让kendo事件使用外部Javascript文件工作？

Answer 1

问题是您的 afterGridLoaded 函数包裹在 jQuery 闭包函数中，这意味着您无法从闭包外部调用它。

删除闭合并将脚本标记移动到页面底部

// $(function () { get rid of this
function afterGridLoaded(e) {
    $(".k-button.xxx").click(function () {
        debugger;
        var idEmployee = $(this).attr('tag');
        myJsFunc(idEmployee);
    });
}
//}); and this