Блог

Главная - Вопросы по программированию - jQuery — Делайте только один раз

jQuery — Делайте только один раз

#javascript #jquery #d3.js

Вопрос:

Я хочу проверить, имеет ли элемент class .active, если он добавляет: margin-top: 4px;

Однако я хочу, чтобы это произошло только один раз, когда страница загрузится, как только класс будет обнаружен, я не хочу обнаруживать его снова и добавлять стиль CSS.

Этот класс применяется при наведении курсора на определенные элементы.

Возможно ли это в jQuery?

Ответ №1:

Проверьте одно событие. Документированный пример:

 $('#foo').one('click', function() {
  alert('This will be displayed only once.');
});

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

1. Я не думаю, что «один» решит проблему дэниса. Можно ли быть привязанным к готовому документу?

2. @Хантер — оп сказал: «Этот класс применяется, когда на определенные элементы наведен курсор». это заставило меня поверить, что он хочет, чтобы событие наведения курсора мыши срабатывало только один раз на определенных элементах. Конечно, я могу ошибаться, и в этом случае ваш ответ, вероятно, будет правильным.

Ответ №2:

Это сработает один раз при загрузке страницы

 $(function(){ 
    if ($("#elementid").hasClass("active"))
    {
        $("#elementid").css("margin-top", "4px");
    }
});

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

1. Я не думаю, что в этом случае «один» необходим. Использование этого решения будет работать — — — document.ready срабатывает только один раз.

Ответ №3:

Обычно я делаю это так:

 (function($) {

  // my custom function to process elements
  function myProcessFunction(context) {

    // get context    
    context = context || document;

    // select elements within the context, filter out already processed ones
    // loop through remained (unprocessed) elements
    // '.my-class' - selector for the elements I want to process
    $('.my-class:not(.my-class-processed)', context).each( function(i.e){

      // mark the element as processed
      $(e).addClass('my-class-processed');

      // add process code here 

    });
  }

  // run myProcessFunction on document.ready 
  $(document).ready( function(){
    myProcessFunction();
  });

})(jQuery);

Таким образом, у меня есть:

  • функция многократного использования
  • обработанные элементы помечены и не будут обработаны при следующем вызове функции
  • элементы обрабатываются только в контексте, если они указаны (например, HTML-код, возвращаемый по запросу AJAX)

Надеюсь, это поможет )

Метки: