Bootstrap changes the button loading state


When there is an activation button in bootstrap, the button becomes unavailable.

According to the method in the official website, add a data-loading-text=” loading…” on the button button. Property, and then the js general code looks like this:

<button type="button" id="myButton" data-loading-text="Loading..." class="btn btn-primary" autocomplete="off">
  Loading state
</button>
<script>
  $('#myButton').on('click', function () {
    var $btn = $(this).button('loading')
    // business logic...
    $btn.button('reset')
  })
</script>

Where the autocomplete=“off” property is for FF browser after the page load, the disabled state will not automatically unusable. When I directly used the above code, I found that the loading state was not available. And then I changed it myself, and I wrote it like this, and it was OK

<script>
// is used to change the loading state of the press button
    function loag() {
      var btn = $("#btn_login");
      btn.button('loading');
      setTimeout(function () { btn.button('reset'); },2000);
    }
</script>
 <button type="button" class="btn btn-default" data-loading-text="Loading..." autocomplete="off" onclick="loag()" id="btn_login"> landing </button>

A little change can achieve our requirements, I do not know whether the official part is put up without testing, here the solution is recommended to partners.