icon RUS

80

Как преобразовать кнопку в спиннер?

Mosoyne
Mosoyne
   02:15
2365
Я хотел бы сделать кнопку, которая при нажатии превращается в спиннер. Я нашел способ использовать bootstrap.
<button class="btn btn-primary" type="button" disabled>
  <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
  <span class="sr-only">Loading...</span>
</button>
Однако кнопка сделана из JavaScript.
var upload = document.createElement('BUTTON');
upload.href="#";
upload.innerHTML = "録音をアップロード";
upload.style.fontFamily = "'M PLUS Rounded 1c', sans-serif";
upload.className = "btn btn-primary btn-lg";
Как я могу сделать так, чтобы эта кнопка была спиннером, если ее нажать?
Статус:
В процессе
Приоритет:
Низкий
Версия:
  • 4.x
Каталог документации:
Компоненты/Buttons
imazin ответил на вопрос

14:29 

$(document).ready(function() {
	$(".btn.btn-primary").on("click", function() { 
   $(this).addClass("d-none");
   $(".spinner-border").removeClass("d-none");
  });
});



<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<button class="btn btn-primary">
  Push Me
</button>
<div class="spinner-border d-none" role="status">
  <span class="sr-only">Loading...</span>
</div>


https://jsfiddle.net/dunglnh/uzvw8gmj/11/
Mosoyne ответил imazin

15:51

Спасиб! Получилось

Активность