Как проверить, если видовое окно меньше определенной ширины, используя javascript?

Question

Я хочу иметь простой оператор, чтобы установить переменную bool в false или true. isMobile должен быть установлен в true, если область просмотра меньше 768 пикселей, а выше этой суммы должно быть установлено значение false.

Я не знаю, почему следующий код ничего не делает. Также в журнале консоли отсутствует ошибка.

var w = $(window).width(); 
var isMobile = false; 

function resizer() { 
    if (w < 768) { 
     console.log("resize"); 
     isMobile = true; 
    } else { 
     isMobile = false; 
    } 
} 

$(window).resize(function() { 
    resizer(); 
}); 

Answer 1

Поскольку вы не измеряете ширину при каждом изменении размера. Попробуйте так:

var isMobile = false; 

function resizer() { 
    var w = $(window).width(); 
    if (w < 768) { 
     console.log("resize"); 
     isMobile = true; 
    } else { 
     isMobile = false; 
    } 
} 

$(window).on('load resize', function(){ 
    resizer(); 
}); 

Answer 2

Move var w = $(window).width(); внутри resizer(). Это получит значение current Размеры window.

См. Комментарии в тексте в коде.

var isMobile = false; 

function resizer() { 
    var w = $(window).width(); 
    // Move this inside resize handler 

    if (w < 768) { 
     console.log("resize"); 
     isMobile = true; 
    } else { 
     isMobile = false; 
    } 
} 

$(window).resize(function() { 
    resizer(); 
}).trigger('resize'); 
// ^^^^^^^^^^^^^^^^^^ 
// 
// Trigger event on page load