某些 Javascript 在单个页面上有效，但在通过 Drupal 主题 javascript 全局加载时无效

Question

在 SO-chat 上，有人建议我在这里问以下问题：

我想通过 Drupal 主题的 Javascript[=37= 在我的完整网站上全局加载一些 Javascript ];而不是必须重新插入 Javascript - 一遍又一遍地对每篇文章进行编码。

例如，我使用以下代码来管理它（假设它在本地插入时包含在 <script type="text/javascript">...</script> 中）：

（在每页插入时在本地工作正常，在全局加载到 Drupal 主题的 javascript 时也工作正常）：

(function ($) {
    $(document).ready(function () {
        $
        $(".toggler").click(function () {
            $(this).next().slideToggle("slow");
        }).next().hide();
        $("a[href^=#]").click(function () {
            var id = $(this).attr('href');
            $(id).parents('.toggled').fadeIn("fast");
        });
    });
})(jQuery)

但是，对于其他 2 个 Javascript，我无法在全局加载它们时使它们正常工作。但是，当它们在本地插入到每篇连续的文章中时效果很好，因此（我将仅提及 1 个较小的代码，以供参考）：

（假设它在本地插入时再次包裹在 <script type="text/javascript">...</script> 中）：

(function($) {
    $(document).ready(function() {
        function getKey(element) {
            return element.href;
        }

        function sameGroupAs(element) {
            var key = getKey(element);
            return function() {
                return getKey(this) === key;
            }
        }
        $(document).on("mouseenter", "a", function() {
            $("a").filter(sameGroupAs(this)).addClass(
                "active");
        }).on("mouseleave", "a", function() {
            $("a").filter(sameGroupAs(this)).removeClass(
                "active");
        });
    });
})(jQuery)

仅供参考：如果您对我如何添加 Javascript to a Drupal's theme 感兴趣的话。

Answer 1

解决方案只是将每个 "script" 放在单独的 .js 文件中。如果将它们放入一个 .js 文件中，它们就会全部变得功能失调。

有谁知道这是 Drupal 特有的策略，还是 Javascript 通用且 "the field" 中的每个人都知道？

Answer 2

此问题与 Drupal 无关，只是 javascript 的事情。我想（但没有测试）它的发生是因为你定义了一个匿名函数 (function($) {...})(jQuery) 两次。在所有语言中，两个函数名称可能永远不会相同。如果您想确定，详细信息应该在浏览器的 JavaScript 控制台中可见。

除此之外，将两个脚本合二为一会更整洁，因为它们都在文档加载时触发。如果您需要更多地了解脚本的哪一部分执行特定功能，将其拆分为多个文件（正如您已经发现的那样）也可以。