从 javascript 更改 html 文档的光标类型

新手上路,请多包涵

假设我有一个 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 将其推出点击事件处理程序本身的某些东西允许 FireFox 自己弄清楚光标应该改变。不幸的是,IE 不是那么聪明,所以我把光标代码放回去了。

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

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

原文由 Joel Coehoorn 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 325
2 个回答

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

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

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

原文由 Greg 发布,翻译遵循 CC BY-SA 2.5 许可协议

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

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

原文由 Ilya Birman 发布,翻译遵循 CC BY-SA 2.5 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题