Html（添加了class .spinner）：

<div class="col-6">
    <button type="button" name="btn-enviar" class="btn btn-primary w-100">
    <span class="spinner spinner-border spinner-border-sm mr-3" id="spinner" role="status" aria-hidden="true">
    </span>Enviar</button>
</div>

添加css到css-file：

#spinner { display:none; } 
body.busy .spinner { display:block !important; }

或者使用可见性：

#spinner { visibility:hidden; } 
body.busy .spinner { visibility:visible !important; }

JQuery：

$(document).ready( function()
{
  $('#spinner').on('click', function()
  {
    $('body').addClass('busy');
  });
});

完成后，执行以下操作：

$('body').removeClass('busy');

通过在html页面的主体中添加一个像'忙碌'这样的类，你也可以做一些非常好的事情，比如阻止输入元素等，而不需要额外的js代码。让CSS代替js为你做所有的工作。你只需要添加一些额外的CSS规则。
PS：用html验证器检查你的html是否有错误。如果标记中有错误，可能会发生奇怪的事情或者它不起作用。
玩得开心。

元素上有animation和-webkit-animation css属性。
使用这样的类

.stop {
 animation-name: none !important;
 -webkit-animation-name: none !important;
}

使用JQuery你可以在元素上切换这个类。如果添加了它，动画将停止。

更新这将显示然后隐藏微调器。

x一个一个一个一个x一个一个二个x

我只是遇到了同样的问题，并解决了它与visibility风格属性。
超文本：

<span class="spinner-border spinner-border-sm" id="spinner" style="visibility: hidden"></span>

联森：

let spinner = document.getElementById("spinner");
spinner.style.visibility = 'visible'; //'hidden'

$（“#spin_ID”）.attr（'hidden'，true）;//隐藏
$（“#spin_ID”）.attr（'hidden'，false）;//显示

我没有得到你的代码，但我把我的想法，你可以试试，如果可行的。

$(document).ready(function() {
  $("#spinner").spinner({
    start: function(event, ui) {
      $('#d1').html("Spinner has started ");
    },
    stop: function(event, ui) {
      $('#d1').html("Spinner has stopped ");
    }
  });
});

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<link href="https://code.jquery.com/ui/1.12.1/themes/blitzer/jquery-ui.css" rel="stylesheet">
<input id="spinner" class='selector' value=12 size=3>
<div id=d1></div>