Как использовать jquery, чтобы скрыть элементы на мобильном телефоне?

Question

В моем скрипте тега моей индексной страницы есть:

if ($(window).width() < 700px){
  $('container').hide();
}

В моей консоли я получаю

Uncaught SyntaxError: Неверный или неожиданный ввод

Answer 1

В вашем коде есть две проблемы. Во-первых, 700 px не является допустимым выражением. Было бы, если бы он был в кавычках, чтобы сделать его строкой, но это не сработало бы (как вы ожидаете) с оператором <. Поскольку метод width() возвращает целое число, просто сравните его с 700.

Во-вторых, container не является допустимым селектором, поскольку в HTML отсутствует элемент <container />. Я предполагаю, что это должен быть селектор id или class, и вы пропустили префикс # или ..

if ($(window).width() < 700) {
  $('#container').hide(); // or .container, maybe?
}

Однако , если вы пытаетесь настроить макет вашей страницы в соответствии с шириной экрана, вам не следует использовать JS. Вместо этого используйте CSS Media Queries:

@media (max-width: 700px) { 
  #container {
    display: none;
  }
}