JSFiddle - React, Tailwind, and code Playground

by Geoffrey Gazet

HTML

<div data-role="page" id="page1">
  <div data-role="content">
    <div data-role="controlgroup">
      <button class="show-page-loading-msg" data-theme="a" data-textonly="false" data-textvisible="true" data-msgtext="Loading theme a" data-icon="arrow-r" data-iconpos="right">Loading</button>
      <button class="hide-page-loading-msg" data-icon="delete" data-iconpos="right">Hide</button>
    </div>
  </div>
</div>

JavaScript

$(document).on( "click", ".show-page-loading-msg", function() {
  var theme = "a",
  msgText = "Veuillez patienter",
  textVisible = "true",
  textonly = false,
  html = "";
$.mobile.loading( 'show', {
  text: msgText,
  textVisible: textVisible,
  theme: theme,
  textonly: textonly,
  html: html
  });
})
.on( "click", ".hide-page-loading-msg", function() {
  $.mobile.loading( "hide" );
});