CSS 背景图像在表单提交后不会加载
我有一个搜索表单,一旦提交,就会在新页面上加载搜索查询的结果。然而,当您按下提交时,大约需要 10 秒左右的时间才能呈现下一页,因此在用户等待下一页加载时,我会显示一个加载框(通过 ExtJS)。
问题在于 IE9 中,使用背景图像的边框未显示在加载框中。
我做了一些挖掘,我得出的结论是,由于某种原因,在提交表单后(并且下一页已开始加载),IE9 将不会加载 CSS 中指定的任何图像。
如果我在提交表单之前使用以下代码设置 200 毫秒的超时,则一切都会正常加载。
function() {
Ext.MessageBox.wait('Searching for tenants eligible for rent increase...', 'Searching');
setTimeout(function() { document.getElementById('rental_increase_form').submit(); }, 200);
return false;
}
所以这是我的问题:
其他人可以确认 IE9 在下一个页面请求开始后不会在当前页面上加载 CSS 图像吗?这是一个错误还是预期的功能?任何人都可以建议一个在提交表单之前不涉及设置超时的解决方案吗?这个解决方案似乎有点黑客。
I have a search form that, once submitted loads the results of the search query on a new page. When you press submit, however, it takes about 10 seconds or so before the next page is rendered, so I'm showing a loading box (via ExtJS) while the user waits for the next page to load.
The problem is in IE9, the border, which uses background images, isn't showing up on the loading box.
I've done some digging around, and I've concluded that for some reason IE9 will not load any of the images specified in the CSS after the form has been submitted (and the next page has begun to load).
If I use the following code to set a timeout of 200 milliseconds before the form is submitted, everything loads fine.
function() {
Ext.MessageBox.wait('Searching for tenants eligible for rent increase...', 'Searching');
setTimeout(function() { document.getElementById('rental_increase_form').submit(); }, 200);
return false;
}
So here's my questions:
Can anyone else confirm that IE9 does not load CSS images on the current page after the next page request has begun? Is this a bug or intended functionality? Can anyone suggest a solution that doesn't involve setting a timeout before submitting a form? That solution seems a little hackish.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
这里没有 IE 来确认,但是您可以在第一页的开头预加载这些图像吗?例如,创建一组隐藏元素,在 CSS 中设置这些背景图像。这样,当您显示加载框时,您将加载图像。虽然不知道这是否是唯一的问题,但您可以尝试看看它是否有效。
Don't have IE here to confirm, but can you just pre-load these images on start of the first page? E.g. make a set of hidden elements that have these background images set in their CSS. That way, you'll have the images loaded and when you show the loading box. Don't know if that is the only issue, though, but you can try to see if it works.