4

我正在写一个用户脚本。我想做的很简单。我需要在脚本执行一些后台任务时阻止 UI。我在另一个 SO question 中看到了这种方法，并对其进行了一些更改以适合我。

检查这个小提琴。当您单击按钮时，它会覆盖 UI。

现在由于这将在网页上使用，我需要通过脚本将以下 HTML 部分注入网页。

<div id="blocker">
<div>Loading...<img src="http://www.socialups.com/static/images/fbinventory/ajax_loader.gif"></div>
</div>

我是这样做的。

var blockUI = document.createElement("div");
blockUI.setAttribute("id", "blocker");
blockUI.innerHTML = '<div>Loading...<img src="http://www.socialups.com/static/images/fbinventory/ajax_loader.gif"></div>'
document.head.appendChild(blockUI);

检查这个小提琴以获得清晰的想法。

但它不起作用。我尝试了几种方法来解决这个问题，但无济于事。谁能指出我在这里做错了什么？

谢谢你。

PS - 我需要在不使用 jQuery 或库 blockUI 的情况下执行此操作。

4

3 回答 3

6

您正在尝试将内容附加到head; 将其附加到body。

http://jsfiddle.net/dAKQX/

于 2012-01-08T08:48:37.447 回答
3

不要将块放在文档div的部分中。head改为使用document.body.appendChild(blockUI);。

于 2012-01-08T08:43:40.277 回答
2

您需要将您的 div 附加到文档的正文中。见：http: //jsfiddle.net/zkzQy/1/

或在您的代码中像这样：

document.body.appendChild(blockUI);
于 2012-01-08T08:44:07.520 回答