viewport on load/resize find class remove jQuery

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); 

Я получаю эту ошибку, указав:

Uncaught ReferenceError: mobileViewUpdate is not defined

, глядя на этот код, что я делаю неправильно здесь, чтобы получить эту ошибку?

Answer 1

Глядя на этот код, mobileViewUpdate не определен нигде в нем.

Answer 2

после игры некоторое время я смог сделать это таким образом. не уверен, что это самый оптимальный способ, но он отлично работает.

$(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(); 

Я должен получить новый значок, чтобы понять это самостоятельно! :)

Answer 3

I'm getting this error stating:

Uncaught ReferenceError: mobileViewUpdate is not defined

именно: вы вызываете функцию с именем 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"); 
    } 
});