XPage 和加载 JavaScript 文件

Posted 2023-05-09

【中文标题】XPage 和加载 JavaScript 文件

【英文标题】：XPages and Loading JavaScript Files

【发布时间】：2018-01-22 15:42:39

【问题描述】：

我正在使用带有 Bootstrap 3 的 xPages，并且之前询问过如何让 formValidation.io 正常工作。在 Brahim Arkni 的帮助下，我能够做到这一点，这取决于没有加载 javascript 文件这一事实。

我现在正在尝试使用 intlTelInput 并收到相同类型的消息“intlTelInput 不是函数”，所以我正在研究这是同一个问题的理论。所有文件都已加载，但可能没有按正确的顺序或在正确的时间加载。

所以我的问题是，你什么时候会从你的主题文件中调用一个 .js 文件（它会加载，但会在一长行中显示所有 .js 文件，这样很难搜索以查找是否加载了正确的文件）使用这个语法：

    <resource>
            <content-type>application/x-javascript</content-type>
            <href>formvalidation/dist/js/formValidation.js</href>
    </resource>

或者你什么时候加载自定义控件或 xPage 中的文件（然后在查看加载了哪些文件时，它们会显示在单独的行上），使用：

    <script src="build/js/intlTelInput.js"></script>

我应该补充一点，所有这些文件都在我的应用程序的 WebContent 文件夹中。

是否有一种“正确”的方式来加载 Javascript 文件以及如何知道加载它们的顺序？

2017 年 8 月 15 日： 非常感谢 Per 的帮助。注释掉的部分是文件中的内容，上面的代码是我将其更改为的内容。我怎么出错了，因为我仍然收到相同的错误消息，以及函数 a 的“意外令牌” 非常感谢 Per 的帮助。注释掉的部分是文件中的内容，上面的代码是我将其更改为的内容。我怎么错了，因为我仍然收到相同的错误消息，以及函数 a 的“意外令牌”

! function(a) 
 if(typeof module && module.exports)
    "object" == module.exports=a(require("jquery"), window, document;
    return "object";
 else 
    "function" == define(["jquery"], function(b) 
       a(b, window, document)
        );
    return "function";
    
 
//! function(a) 
//    "function" == typeof define&&define.amd? define(["jquery"],    function(b) 
//        a(b, window, document)
//    ) : "object" == typeof module && module.exports ? module.exports = a(require("jquery"), window, document) : a(jQuery, window, document)      
//

【参考方案1】：

jQuery 插件 intl-tel-input 使用与 XPages 中的 Dojo 冲突的 AMD。有关如何禁用 AMD 以使插件正常工作的解决方案，请参阅 this answer。

在您的情况下，您应该将intlTelInput.min.js 的第一部分更改为以下内容（我已将 define.amd 替换为 false）：

!function(a)"function"==typeof define&&false?define(["jquery"],function(b)a(b,window,document)): ...

【讨论】：

请参阅上面我尝试进行更改以禁用 AMD 但由于某种原因未成功。

我已经更新了我的答案，以明确你应该改变什么。

@LenniSauve 非常棒！欢迎来到堆栈溢出。请将答案标记为已接受。谢谢:-)