Question

我在视口中使用jQuery来查找类并根据窗口宽度将其删除。

想象一下，我们有桌面版本，我们的目标是调整大小，移动版本重新加载。代码工作正常但在destkop上有一个问题。

$(window).load(function() {
    var viewportWidth = $(window).width();
    if (viewportWidth < 600) {
        $(".dropdown-toggle").removeClass("disabled");
    }
 });

$(window).resize(function () {
    var viewportWidth = $(window).width();
    if (viewportWidth < 600) {
        $(".dropdown-toggle").removeClass("disabled");
    }
});

$(window).load(mobileViewUpdate);
$(window).resize(mobileViewUpdate);

我收到此错误说明：

未捕获的ReferenceError：未定义mobileViewUpdate

查看此代码我在这里做错了什么来获取此错误？

Answer 1

我收到此错误声明：

未捕获的ReferenceError：未定义mobileViewUpdate

确切地说：你正在调用一个名为mobileViewUpdate()的函数，但是代码中没有定义这样的函数。此外，即使存在mobileViewUpdate()，也无需调用它，因为您已经在load和resize事件中拥有正在执行所需操作的匿名函数。

所以，首先，你可以简单地删除这两行：

$(window).load(mobileViewUpdate);
$(window).resize(mobileViewUpdate);

此外，您的两个匿名函数是相同的 - 它们只针对不同的事件。所以你可以像这样合并它们：

$(window).on("load resize", function() {
    var viewportWidth = $(window).width();
    if (viewportWidth < 600) {
        $(".dropdown-toggle").removeClass("disabled");
    }
});

Answer 2

查看此代码，mobileViewUpdate未在其中的任何位置定义。

Answer 3

在玩了一会儿之后，我能够这样做。不确定它是否是最佳方式，但效果很好。

$(window).resize (function() {
        // This will fire each time the window is resized:
        if($(window).width() <= 600) {$(".dropdown-toggle").removeClass("disabled");}
        })
     .resize ();

     $(window).load (function() {
        // This will fire each time the window is resized:
        if($(window).width() <= 600) {$(".dropdown-toggle").removeClass("disabled");}
        })
.load ();

我应该获得一个新徽章，以便我自己搞清楚！ :)

加载/调整大小的视口查找类删除jQuery

3 个答案: