5

假设我有一个 JavaScript 方法,它需要很长时间才能完成,完全没有任何用户反馈。在我的例子中,它正在对表格元素中的行进行排序(全部在 DOM 中;如果有很多行,则只需要很长时间),但它可能会做任何事情。我想在运行时显示“进度”光标。这是我目前所拥有的,但我也尝试了其他几件事:

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

不幸的是,什么也没有发生。MyLongRunningMethod() 正确,但光标永远不会改变。我的想法是浏览器需要等待方法返回才能处理由窗口环境生成的光标更改消息,但这可能是一种方式,即使它是真的我也不知道如何修复它。

还有其他想法吗?


[编辑]:我认为我所写的所有背景故事都不是真的必要。如果您真的想阅读它,请检查修订历史。


最终结果

我最终使用了 RoBorg 的解决方案。它并没有像我最初想的那样搞乱代码,因为我可以将函数声明在那里——就像添加一个内联作用域块一样。

有趣的是,在 Firefox 上我发现这意味着我根本不需要更改光标。我发现在添加 setTimeout 调用后,有时会在设置进度光标之前看到等待光标,所以我注释掉了我的光标代码。事实证明,使用 setTimeout 将其推出 click 事件处理程序本身的某些东西允许 FireFox 自行确定光标应该更改。不幸的是,IE 并不那么聪明,所以我确实把光标代码放回去了。

这使我相信光标更改是此处的适当操作 - 如果有机会,它就是浏览器无论如何都会做的事情。对于我知之甚少的页面,我真的不想在 DOM 中添加和删除新项目(例如某种类型的忙碌图像)。无论页面使用何种视觉设计,脚本都应该匹配。

最后,Chrome 让整个事情变得无关紧要。使用相同的数据,Chrome 在不到 5 秒的时间内完成了 IE 和 Firefox 10 到 15 秒的工作。所以他们的javascript引擎真的更快。我等不及 Firefox 3.1 引擎了。不幸的是,这里的人们仍然主要使用 IE6。

4

3 回答 3

9

使用计时器是不可能的吗?

document.body.style.cursor = "progress";

setTimeout(function()
{
    SortTable(cell.cellIndex, dir, sortType);
    document.body.style.cursor = "auto";
}, 10);
于 2009-03-12T20:23:34.647 回答
2

在 web 中,更改鼠标光标不是传统的,也不是很好。

在页面本身上使用一些小动画会更好(也更容易),请查看http://www.ajaxload.info/以获取此类图像(它是在线生成器)。

于 2009-03-12T20:49:32.340 回答
0

尝试删除 document.body.style.cursor = "auto" 并将其放入 SortTable 函数完成时调用的函数中。这样,您将保留忙碌光标,直到功能完成。确保如果您在 SortTable() 中遇到错误条件,您仍然会点击“不再忙”函数调用。

于 2009-03-12T20:43:19.827 回答