Кнопки Twitter Bootstrap имеют хорошее Loading...
состояние.
Дело в том, что он просто показывает сообщение, которое Loading...
прошло через data-loading-text
атрибут:
<button type="button" class="btn btn-primary start" id="btnStartUploads"
data-loading-text="@Localization.Uploading">
<i class="icon-upload icon-large"></i>
<span>@Localization.StartUpload</span>
</button>
Глядя на Font Awesome, вы видите, что теперь есть анимированная иконка .
Я попытался интегрировать этот значок счетчика при запуске такой Upload
операции:
$("#btnStartUploads").button('loading');
$("#btnStartUploads i").removeAttr('class');
$("#btnStartUploads i").addClass('icon-spinner icon-spin icon-large');
но это никак не повлияло, то есть я просто вижу Uploading...
текст на кнопке.
Можно ли добавить значок, когда кнопка находится в состоянии загрузки? Похоже, что Bootstrap просто удаляет значок <i class="icon-upload icon-large"></i>
внутри кнопки, находясь в состоянии загрузки.
Вот простая демонстрация, которая показывает поведение, которое я описал выше. Как вы видите, когда он входит в состояние загрузки, значок просто исчезает. Он появляется сразу после временного интервала.