如何在没有javascript的情况下显示页面加载?
我正在为未启用 JavaScript 的用户(访问者的比例高得惊人)重建我们的网站。
在不使用 JavaScript 的情况下向用户显示某些内容正在加载的最佳方式是什么。
背景:我们的登录必须在登录之前搜索电子邮件服务器,有时可能需要 5-10 秒,有时多达二十个。
当前的想法:我应该使用一个新按钮重新加载登陆页面,该按钮显示正在加载和加载程序图标,然后将其重定向到实际使用标头登录的页面
刚刚意识到我不能这样做,因为 php 重新加载必须在页面上显示任何内容之前。
有什么想法吗?也许我可以使用 onclick CSS?
我可以创建一个隐藏表单,然后在操作完成后使用 php 提交表单吗?
I'm in the middle of re-building our website for users who don't have javascript enabled (surprisingly high percentage of our visitors).
What is the best way to show a user that something is loading without using javascript.
Background: Our login has to search for an email server before it logs someone in, it can sometimes take 5-10 seconds, sometimes up to twenty.
Current Thinking: I should reload the landing page with a new button that says loading and a loader icon and then redirect that to a page that actually does the logging in with header
Just realized I can't do this because the php reload has to be before anything is displayed on the page.
Any ideas? Perhaps there's onclick CSS I can use?
Could I create a hidden form and then submit the form w/ php once the operations are finished?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
浏览器通常不会等到接收整个页面才显示它。因此,您的脚本可以回显页面标题和页面开头,并显示一条消息,告诉您等待页面完成加载,然后根据身份验证是否成功显示页面的其余部分。最后,可能会有一个 javascript 重定向,并为未激活 javascript 的用户提供备用重定向链接。
您还可以尝试使用元刷新标记。每次重新加载页面时,脚本都会检查身份验证是否完成。
Browsers usually don't wait to receive the entire page before displaying it. So your script could echo the page headers and the beginning of the page, and display a message telling to wait the page finish to load, then display the rest of the page, according to the success or not of the authentication. At the end, there could be a javascript redirection, with an alternate redirect link for those who javascript isn't activated.
You could also try using meta refresh tag. Each time the page is reloaded, the script could check if the authentication is done.
从弹出旋转“加载”图标的“传统”意义上来说,这实际上是不可能的,因为 javascript 是在不刷新的情况下操作当前页面的唯一方法。 CSS 仅用于演示,没有任何方法知道按钮是否已被单击。而且,如果您的大多数用户都使用 IE,那么无论如何,更“高级”的 CSS 功能发挥作用的机会并不大。
综上所述,您最初的想法是可行的(进一步思考,也许不行?)。使用带有加载图标和“请稍候”文本(其中包括登录逻辑)的登陆页面,然后使用元刷新(或 302 重定向)重定向到网站本身,超时时间为 20 秒(或大约最大超时时间)值得让某人登录)。
将此与查尔斯的答案结合起来可能会起作用。在基本加载页面上显示 20 秒超时元刷新标头,然后在源文件中将 PHP 用于登录。
It's not really possible in the "traditional" sense of popping up a spinning 'loading' icon, since javascript is the only way to manipulate the current page without refreshing. CSS is only used for presentation, and doesn't have any way to know if a button has been clicked. And if most of your users are on IE, there's not much chance of the more 'advanced' CSS features working, anyway.
All of that said, your initial thought would work (on further thought, maybe not?). Use a landing page with a loading icon and "please wait" text, which includes the login logic, then re-direct to the website itself, using a meta refresh (or 302 redirect) with the timeout of 20 seconds (or the approximate maximum value it would take to log someone in).
Combining this with Charles answer would probably work. Display a 20 second time out meta refresh header with the basic loading page, then have the PHP for the login below that in the source file.
对于没有 javascript 的重新加载,您可以使用元刷新,
登录表单会将用户重定向到带有加载消息和加载器图标的某个页面,例如,真实的 url 将在 5 秒后加载
5 秒后,如果登录过程尚未完成(服务器端脚本中的一些 if-else 逻辑),带有加载消息和加载器图标的页面将继续显示,
无需 JavaScript,您仍然可以做很多事情,但这要棘手得多
甚至还有一些不使用 javascript 的 ajax 技术......
for reloading without javascript you can use the meta refresh
the login form will redirect user to some page with the loading message and loader icon, the real url will be loaded after 5 seconds for example
after those 5 seconds, if the login process isn't done yet (some if-else logic in your serverside script), the page with loading message and loader icon will continue to be showed
without javascript you can still do a lot of thing, but it's much trickier
there are even some ajax-without-javascript techniques...