外部JS文件功能看不到页面功能

问题描述

我有一个加载外部 JS 文件的现有旧版 aspx 页面。我正在添加功能并在页面上的脚本块中添加了一个异步函数。外部JS文件修改为调用async函数。无论我在页面上的哪个位置加载外部脚本，它仍然继续抱怨未定义页面功能。我被严重卡住了！谢谢

更新：

    ///loading scripts 
    <script src="../_scripts/jquery-3.4.1.min.js"></script>
    <script src="../_scripts/bootstrap-4.6.0.min.js"></script>
    <script src="../_scripts/jquery.datatables.min.js"></script>
    <script src="../_scripts/datatables.select.min.js"></script>
   //page function
    <script type="text/javascript">
        $(document).ready(function () {
           
            async function providerPopUp() {
                await $.ajax({
                    url: '../Provider/PreCert_PrvSearch.aspx',method: 'get',data: { typeOfSearch: typeOfSearch,coIdNbr: coIdNbr },dataType: 'json',success: function (response) {.......

   //load external script after page script
    <script src="../_scripts/PreCert_Create.js"></script>

   //call to page function added to external js file
    function Pop_Modal_Window_NPI (){
        providerPopUp()
            .then((result) => {
                console.log('result: ' + result);
                retPrv = result;
            })

外部JS文件函数Pop_Modal_Window_NPI在文本框模糊时触发

结果未捕获 ReferenceError: providerPopUp 未定义 在 Pop_Modal_Window_NPI (PreCert_Create.js:169) 在 HTMLInputElement.onblur (PreCert_Create.aspx?...parameters)

解决方法

Pop_Modal_Window_NPI() 调用函数 providerPopUp()，但后者位于外壳内，因此不在调用范围内。

您可以通过将函数添加到窗口命名空间来解决此问题：

window.providerPopUp = async function() {
  ...
};

然后 Pop_Modal_Window_NPI 内部的调用变为：

window.providerPopUp()

（你甚至不需要在函数调用前加上 window 前缀，我只是为了一致性而这样做）