Question

我有一个js脚本应该在滚动时修复我的侧边菜单。它显示它包含在view source中，如果我将我的代码复制/粘贴到控制台中以自动启动它，它可以很好地工作。

我怎样才能弄清楚为什么它不会在负载上发射？也没有错误。有问题的文件有2个功能，第一个是将菜单固定到顶部，第二个是通过选中复选框来处理更改内容。

这是我的剧本：

    // FIX SIDE BAR AFTER SCROLL
        $(window).load(function() {
console.log('test');
$("a[href*=#]:not([href=#])").click(function() {
        if (location.pathname.replace(/^\//, "") == this.pathname.replace(/^\//, "") && location.hostname == this.hostname) {
            var o = $(this.hash);
            if (o = o.length ? o : $("[name=" + this.hash.slice(1) + "]"), o.length) return $("html,body").animate({
                scrollTop: o.offset().top
            }, 900), !1
        }
    });
console.log('test2');
$(window).load(function() {
    var o = $(".sticky").offset().top,
        t = function() {
            var t = $(window).scrollTop();
            t > o ? $(".sticky").addClass("stuck") : $(".sticky").removeClass("stuck")
        };
    t(), $(window).scroll(function() {
        t()
    });
console.log('test3');
});

//RADIO BUTTON CONTENT CHANGER
      $(function(){ 
    $('input[name="pricing-radios"]').on('change', function(){
        if ($(this).val()=='pricing1') {

            //change to "show update"
             $(".pricing-engage-chng").text("179");
             $(".pricing-engage-chng-additional").text(".01");
             $(".pricing-crm-chng").text("214");
             $(".pricing-crm-chng-additional").text(".01");
             $(".upgrade-price").text(".0025");


        } else if ($(this).val()=='pricing2') { 
             $(".pricing-engage-chng").text("699");
             $(".pricing-engage-chng-additional").text(".005");
             $(".pricing-crm-chng").text("714");
             $(".pricing-crm-chng-additional").text(".006");
             $(".upgrade-price").text(".0015");

        } else if ($(this).val()=='pricing3') {
             $(".pricing-engage-chng").text("3,499");
             $(".pricing-engage-chng-additional").text(".0025");
             $(".pricing-crm-chng").text("3,514");
             $(".pricing-crm-chng-additional").text(".00325");
             $(".upgrade-price").text(".00075");
        } 

    });

    });

    });

我的代码似乎适用于我的 JSFiddle ，正如我所说，将我的代码复制并粘贴到我的控制台中会触发我的命令并产生所需的结果。

您也可以看到实时页面 here 。

感谢您的帮助！

Answer 1

好吧所以我想出来了：

我们使用的框架中有一个自动缩小功能。因此，当我提取旧代码时，此部分技术上缩小。所以我的vars正在返回未知元素。

$(window).load(function() {
    var o = $(".sticky").offset().top,
        t = function() {
            var t = $(window).scrollTop();
            t > o ? $(".sticky").addClass("stuck") : $(".sticky").removeClass("stuck")
        };
    t(), $(window).scroll(function() {
        t()
    });

我最终重写了一个函数来添加类并将其简化了一点并提出了这个：

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

    //if less than or = to 350 add class
    if (scroll >= 350) {
        $(".sticky").addClass("stuck");
    // else remove class
    } else {
        $(".sticky").removeClass("stuck");
    }
    });

现在这个被缩小了，但是一切都是预定义的并且是可读的。

包含JS，但不会在加载时触发？

1 个答案: