Запретить вставку после повторения при изменении размера jquery

#jquery

#jquery

Вопрос:

У меня ситуация, когда insert .after повторяется при изменении размера окна. Я хочу, чтобы insert .after запускался сразу один раз при изменении его размера, а не повторно. Какое хорошее решение для решения этой проблемы?

 if ($(options.accord) .length > 0) {
  if ($(window).width() < 470) {
    $tabs.addClass('example').after('enter tags here');
  }
  $(window).resize(function () {
    if ($(window) .width() < 470) {
      $tabs.addClass('example').after('enter tags here');
    }
  });
}
  

Комментарии:

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

2. я обновил код. я забыл включить resize(). Я просто хочу, чтобы изменение размера загружалось один раз при изменении размера.

3. Почему бы вам просто не проверить .example класс, прежде чем что-либо делать

Ответ №1:

Вы можете использовать локальную переменную, чтобы узнать, был ли after() запущен или нет. Внутренняя функция по-прежнему будет иметь доступ к локальной переменной при ее запуске:

 if ($(options.accord) .length > 0) {
  var afterAdded = false;

  if ($(window).width() < 470) {
    $tabs.addClass('example').after('enter tags here');
    afterAdded = true;
  }

  $(window).resize(function () {
    if (($(window) .width() < 470) amp;amp; ! afterAdded) {
      $tabs.addClass('example').after('enter tags here');
      afterAdded = true;
    }
  });
}
  

Ответ №2:

Предполагая, что вы удаляете example класс, когда размер больше, и у вас есть больше кода для каждого из 2 условий. Вы можете проверить наличие example класса, а затем выполнить добавление / удаление

 if ($(options.accord) .length > 0) {
  if ($(window).width() < 470) {
    if( !$tabs.hasClass('example') ) {
        $tabs.addClass('example').after('enter tags here');
    }
  }
  $(window).resize(function () {
    if ($(window) .width() < 470) {
      if( !$tabs.hasClass('example') ) {
          $tabs.addClass('example').after('enter tags here');
      }
    }
  });
}