多个页面中具有相同函数名的Javascript CallBack

Question

我的目标是在多个页面/ View 中执行相同上下文的自动完成功能，对于具有相同类名的相同输入(即，客户端名称对于许多页面(如创建和编辑 View 等)自动完成)。

由于我需要在每个页面中调用jquery的autocomplete()，所以我写在

Views\Shared_Layout.cshtml

我的项目页面，以便在需要时可以使用自动完成功能。我在_Layout.cshtml中编写的代码如下:

<script>
    $(document).ready(function () {
         //common 
         $('.form-control.salescode').autocomplete({
              minLength: 4,
              source: '@Url.Action("GetAccountManager", "AccountManager")',
              select: callBackSalesCodeLookUp
         });
    });
</script>

然后，任何需要自动完成功能的 View (创建或编辑)都会调用以下代码:

<script>
    function callBackSalesCodeLookUp(event, ui)
    {
        event.preventDefault();
        var selectedArr = ui.item.value.split("|");
        var accountManagerID = selectedArr[0];
        var accountManagerName = selectedArr[1];

        $('.form-control.salescode').val(accountManagerID);
    }
</script>

但是，当我运行该项目时，我在没有以下代码的页面上收到错误，这是预期的:

    function callBackSalesCodeLookUp(event, ui)
    {
        event.preventDefault();
        var selectedArr = ui.item.value.split("|");
        var accountManagerID = selectedArr[0];
        var accountManagerName = selectedArr[1];

        $('.form-control.salescode').val(accountManagerID);
    }

我收到的错误在 Chrome 中为:

jquery-3.1.1.js:3855 Uncaught ReferenceError: callBackSalesCodeLookUp is not defined at HTMLDocument. (Login?ReturnUrl=%2FAccountOpeningRegister%2FCreate:393) at mightThrow (jquery-3.1.1.js:3570) at process (jquery-3.1.1.js:3638)

我想减少代码，这就是我编写这样的内容的原因。我很高兴知道是否有更好的编码方法。

谢谢

Answer 1

在调用该函数之前检查该函数是否存在于窗口中。

<script>
    if (typeof callBackSalesCodeLookUp == 'function') {
         $(document).ready(function () {
              //common 
              $('.form-control.salescode').autocomplete({
                   minLength: 4,
                   source: '@Url.Action("GetAccountManager", "AccountManager")',
                   select: callBackSalesCodeLookUp
              });
          });
    }
</script>