Как добавить такой эффект загрузки в мой jquery код?

Question

[mark878732]

Эффект:


Мой код:

$('#popup-search-input').on('keypress', function (e) {
        if (e.which === 13) {
          $('.search-results').html('searching');
          $.get('/api/entity-product-search/' + $(this).val(), function (data) {
            $('.search-results').html(data);
          });
        }
      });

Я здесь не использую ajax потому что его работу выполняет Drupal behaviors.

Comments

[scottparker]

а что с гуглом, сломался?

Я здесь не использую ajax потому что его работу выполняет Drupal behaviors.

ну ок.

Answer 1

[Eduard J]

$('#popup-search-input').on('keypress', function (e) {
        if (e.which === 13) {
          $('.search-results').html('<div class="loading"></div>');
          $.get('/api/entity-product-search/' + $(this).val(), function (data) {
            $('.loading').remove(); //Можно и не удалять, т.к функция ниже и так очистит контейнер
            $('.search-results').html(data);
          });
        }
 });

В CSS прописываете

.loading {
      background: url('/images/loading.gif');
      width: 40px;
      height: 40px;
}