2016-12-21 4 views
0

У меня есть кнопка, на которой я вызвать открытие начальной загрузки модального всплывающего окна, как следующее:Предотвращения загрузки других классов при открытии начальной загрузки модальных всплывающего

<a class="btn btn-app btnWatchlist" data-toggle="modal" data-target="#myModal" style="min-width:175px;margin:0;height:67px"> 
            <i class="fa fa-save"></i> Add to Watchlist 
           </a> 

модальное всплывающее окно HTML, как следующие:

<!-- Modal --> 
<div id="myModal" class="modal fade" role="dialog"> 
    <div class="modal-dialog"> 

     <!-- Modal content--> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal">&times;</button> 
       <h4 class="modal-title">Modal Header</h4> 
      </div> 
      <div class="modal-body"> 
       <p>Some text in the modal.</p> 
      </div> 
      <div class="modal-footer"> 
       <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
      </div> 
     </div> 
    </div> 

Добавить в группу заметок загружается в DOM после сообщения jQuery на сервер, и когда сервер возвращает HTML, я просто обновляю DOM пользователей, чтобы отобразить эту кнопку.

Проблема в том, что при выполнении jquery post я добавляю класс, который в основном отображает сдвигающую передачу во время выполнения поиска, и теперь, когда я нажимаю кнопку, отображается модальный, но этот класс загрузки загружается а также при нажатии на модальное всплывающее окно.

Код для создания класса загрузки появляться является:

$body = $("body"); 
    function StartLoading() { 
     $(document).on({ 
      ajaxStart: function() { $body.addClass("loading"); } 
     }); 
    } 
    function StopLoading() { 
     $(document).on({ 
      ajaxStop: function() { $body.removeClass("loading"); } 
     }); 
    } 

Теперь, как я могу предотвратить смешивание этих двух, нажимая кнопку «Добавить в список наблюдения» кнопку, так что я могу показать только модальный и удалить загружен класс загрузки после DOM?

P.S. Поэтому в конечном счете я не хочу отображать содержимое класса «загрузка» при нажатии на кнопку, чтобы отобразить всплывающее окно, просто модальное всплывающее окно.

ответ

0

Не уверен, правильно ли я понял ваш вопрос, но вы можете создать переменную, которая отслеживает, загружен ли контент вашего модального файла, а затем заверните оператор $body.addClass("loading"); внутри if(modalHasNotBeenLoaded)?

Смежные вопросы