脚本仅在主页上有效答案

【问题标题】：Script works only on homepage脚本仅在主页上有效
【发布时间】：2015-02-13 16:19:15
【问题描述】：

我在滚动后添加类时遇到问题，这对我来说真的很奇怪，原因如下：

我在多个项目中使用了这个脚本，以前从未遇到过这个问题。当我在主页上向下滚动时，脚本完美运行，“修复”类被添加到“navigacija”类中，社交图标、菜单和语言被固定在页面顶部。但在其他页面上并非如此。向下滚动 145px 后，“Fix”类不会添加到“navigacija”类中。更有趣的是，我故意在this page 插入非常大的图像，直到页面加载该图像，我的脚本才有效（在加载图像之前尝试向下滚动）。当页面完全加载时，脚本不再工作。我在 Joomla 工作，我制作了自己的模板，我没有安装任何模块、组件或插件。只有 Joomla 的标准 js 文件和我之前用这个脚本使用的脚本没有任何问题。

这是我正在开发的网站：http://investfarm.moderanweb.rs/

这是脚本：

$(function() {
    var navigacija = $(".navigacija");
    $(window).scroll(function() {    
        var scroll = $(window).scrollTop();

        if (scroll >= 145) {
            navigacija.removeClass('navigacija').addClass("Fix");
        } else {
            navigacija.removeClass("Fix").addClass('navigacija');
        }
    });
});

请帮忙，提前谢谢。

【问题讨论】：

在您的第二页中，使用$ 似乎存在冲突，如果您使用的是jQueryNoConflict，您应该将$ 更改为jQuery，否则我错了！
控制台出现多个错误。您应该做的第一件事是了解这些错误。
就目前而言，您的网站上加载了 2 个版本的 jQuery，同时尝试加载第 3 个版本（如 @jfriend00 所述，它不起作用）。加载多个 jQuery 实例会导致冲突

标签： javascript joomla conflict

【解决方案1】：

如果您使用 jQueryNoConflict，请尝试将 $ 更改为 jQuery，为什么它在主页上工作，我猜是因为 jQuery 库在 mootools 库之前和之后加载了两次，所以试试这个，你应该对ToolTip 和其他东西做同样的事情：

jQuery(function() {
    var navigacija = $(".navigacija");
    jQuery(window).scroll(function() {    
        var scroll = jQuery(window).scrollTop();

        if (scroll >= 145) {
            navigacija.removeClass('navigacija').addClass("Fix");
        } else {
            navigacija.removeClass("Fix").addClass('navigacija');
        }
    });
});

【讨论】：

这解决了我的问题。谢谢！并感谢大家的快速回复。我会试着弄清楚控制台告诉我什么

【解决方案2】：

对于初学者，开始清理控制台中显示的错误。

你有多个脚本标签指向一个 HTML 页面而不是一个脚本。

<script type="text/javascript" src="/templates/investfarmimpexmd/js/jquery-2.1.1.js"></script>
<script type="text/javascript" src="/templates/investfarmimpexmd/js/wow.min.js"></script>
<script src="/js/wow.min.js"></script>

我不知道你期望加载什么，但它没有加载脚本并且会导致错误。

也许这些被标记为type="text/template"，这样浏览器就不会尝试执行它们，您可以将它们用作模板？

而且，你在这行内联 Javascript 上有一个错误，表明 jQuery 没有正确加载，所以你必须找出原因：

 jQuery(window).on('load',  function() {
     new JCaption('img.caption');
 });

而且，您在同一页面中加载了多个不同版本的 jQuery，但没有管理这些不同版本的使用方式。您不能只加载一个版本的 jQuery，发出jQuery.noConflict()，然后加载另一个版本的 jQuery。第一个在那个时候什么都不做，所以如果你需要它做某事，它就不会起作用。

【讨论】：