如何在 Silverstripe CMS 中使用 javascript？答案

【问题标题】：How to use javascript in Silverstripe CMS?如何在 Silverstripe CMS 中使用 javascript？
【发布时间】：2023-04-02 18:00:02
【问题描述】：

我正在使用 SilverStripe 3.0 CMS，我需要在 CMS 中包含 Google 地图。

我正在关注this steps，除了它有点旧，official documentation 在当前版本的 SilverStripe 中使用相同的方法（至少它似乎是当前版本的文档）。

问题出在这部分代码中：

Behaviour.register({ 
    "#Form_EditForm" : { 
        initialize : function() { 
            this.observeMethod("PageLoaded", this.adminPageHandler); 
            this.adminPageHandler(); 
        }, 
        adminPageHandler : function() { 
            initialize(); 
        } 
    } 
});

首先，行为没有定义。我需要手动包含框架中的 behavior.js 文件。但是现在，我得到一个类型错误：

this.observeMethod is not a function

有人可以告诉我在 SilverStripe CMS 中打开页面编辑器时我可以做些什么来调用 javascript 函数吗？

【问题讨论】：

大部分 js 已经在 3.0 版本中被重写，我猜上面的代码片段已经被弃用了。但是您真的按照您提到的论坛帖子中的步骤进行操作吗？通过“getCMSFields”中的“Requirements”调用附加 javascript 应该可以正常工作。
啊，现在我看到你的问题了，论坛帖子中的代码也使用了这个'Behaviour.register'片段，我将在下面发布一个答案。

标签： javascript silverstripe

【解决方案1】：

您提到的“Behaviour.register”调用已被明确弃用，并且在核心代码中不再可用，因此文档需要在此处更新。

不幸的是，我找不到记录的方法来替换这种行为，但现在根据您直接提到的论坛帖子中的方法，以下方法应该适合您：

找到此处添加的“initGoogleMaps.js”脚本：

function getCMSFields() { 
Requirements::javascript('mysite/javascript/initGoogleMaps.js');  
...

在此脚本中，删除Behaviour.register... 块，并将initialize 函数在 document.ready（或简单地删除document.ready 部分），所以initialize 是全局可用的（您可以考虑重命名它）。

然后，在getCMSFields 中添加以下内容：

$fields->addFieldToTab('Root.Content', new LiteralField('js', '<script>initialize();</script>'));

这将确保每次在 cms 中呈现页面的“编辑视图”时都会调用 initialize 函数。

第

【讨论】：

感谢您的回答。这适用于在浏览站点树时调用该函数。但是现在使用直接链接进入时它不起作用。它似乎在加载字段之前调用了该函数（甚至在 $(document).ready() 中的函数之前），所以当我初始化地图时，我没有任何纬度和经度字段的值.我通过在设置字段时临时调用该函数来解决此问题，否则在 $(documet).ready() 中调用该函数。就目前而言，包括进入编辑页面浏览或使用直接 url。

【解决方案2】：

正如本所说，

LeftAndMain::require_javascript('mysite/javascript/initGoogleMaps.js')

比 'include-it when needed' 更可靠。为什么？因为 Silverstripe 使用 Ajax，所以最好在第一次加载时加载任何 javascript 或 css，这样当您在 ajax 驱动的环境中转到 CMS 内的不同模型管理区域时，它们就可以准备好。在开始时不加载会导致不一致，并且当您不硬加载该管理区域时，您的 js、css 文件将不会被加载。

来自文档：http://doc.silverstripe.org/framework/en/reference/requirements 和 http://api.silverstripe.org/3.0/class-LeftAndMain.html

整个“在需要时包含它”这件事显示了一些弱点 CMS 等领域，其中 Ajax 用于加载大块的应用程序，这可能需要更多的 CSS 和 JavaScript 被包括在内。 在这个阶段，唯一的解决方法是确保您可能需要的所有内容都包含在第一个页面加载中。

一个想法是提到应该包含的 CSS 和 JavaScript 在 Ajax 响应的标头中，以便客户端可以加载完成 Ajax 请求后的那些脚本和样式表。这可以很干净地编码，但为了获得最佳结果，我们想要用我们自己对 Ajax 系统的更改来扩展prototype.js，这样每个脚本都对此提供一致的支持。

顺便说一句，此行的理想位置是自定义模块或 mysite 中的 _config.php，具体取决于您的需要。

【讨论】：

【解决方案3】：

LeftAndMain::require_javascript('mysite/javascript/initGoogleMaps.js')

效果会更好

【讨论】：

为什么？解释是什么使答案有用或正确很重要。