Let's say I have a javascript method that takes a little to long to finish to go without any user feedback at all. In my case it's sorting the rows in a table element (all in the DOM; only takes too long if there are a lot of rows), but it might do anything. I want to show the "progress" cursor while it runs. Here is what I have currently, but I've tried several other things as well:

// SORT

document.body.style.cursor = "progress";
MyLongRunningMethod(); //blocks for 10-15 seconds before returning
document.body.style.cursor = "auto";

CodePudding user response：

Have u tried Promise?maybe that can help u.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise

const MyLongRunningMethod = function(){
            return new Promise((resolve,reject)=>{
                //...dosometing in here
                resolve() //while finish.use the resolve function
            })
        }
      document.body.style.cursor = "progress";
      MyLongRunningMethod().then(res => {
          document.body.style.cursor = "auto";
      }); //blocks for 10-15 seconds before returning

CodePudding user response：

Try this below code;

document.body.style.cursor = "progress";
setTimeout(function(){
SortTable(cell.cellIndex, dir, sortType);
document.body.style.cursor = "auto";}, 10);