WEB中实现页面加载提示

最新推荐文章于 2021-02-13 04:17:06 发布
最新推荐文章于 2021-02-13 04:17:06 发布
阅读量237 收藏
点赞数
文章标签： Web JSP JavaScript HTML ViewUI
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wsrjzhsy0493/article/details/83322304
版权
在Java Web应用中， 当加载一个动态页面时及JSP页面时，如果页面动态数据较多，会有很长一段时间的空白页面，古加上这个页面正在加载的提示，使得应用更加人性化。

Java代码
processbar.jsp  
 
<%@ page language="java" contentType="text/html; charset=UTF-8" 
    pageEncoding="UTF-8"%>  
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
    <head>  
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
        <title>process bar</title>  
        <script type="text/javascript" language="JavaScript">  
              
            //: 判断网页是否加载完成  
            document.onreadystatechange = function () {   
                if(document.readyState=="complete") {         
                    document.getElementById('divprogressbar').style.display='none';   
                }  
            }   
              
        </script>  
    </head>  
    <body>  
        <div id="divprogressbar" 
            style="position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; background-color: #ffffff; filter: alpha (     opacity =     100 ); z-index: 50000">  
            <div style="text-align: center; padding-top: 200px">  
                <table align="center" border="1" width="37%" cellspacing="0" 
                    cellpadding="4" style="border-collapse: collapse" bgcolor="#FFFFEC" 
                    height="87">  
                    <tr>  
                        <td bgcolor="#3399FF" style="font-size: 12px;" height="24" 
                            align="center">  
                            友情提示, 数据正在载入中...  
                        </td>  
                    </tr>  
                    <tr>  
                        <td style="font-size: 12px; line-height: 200%" align="center">  
                            网页正在载入数据中.请耐心等待...  
                            <marquee style="border: 1px solid #000000" direction="right" 
                                width="300" scrollamount="5" scrolldelay="10" bgcolor="#ECF2FF">  
                                <table cellspacing="1" cellpadding="0">  
                                    <tr height=8>  
                                        <td bgcolor=#3399FF width=8></td>  
                                        <td></td>  
                                        <td bgcolor=#3399FF width=8></td>  
                                        <td></td>  
                                        <td bgcolor=#3399FF width=8></td>  
                                        <td></td>  
                                        <td bgcolor=#3399FF width=8></td>  
                                        <td></td>  
                                    </tr>  
                                </table>  
                            </marquee>  
                        </td>  
                    </tr>  
                </table>  
            </div>  
        </div>  
    </body>  
</html>  
 
然后在另外需要使用的页面中加入如下代码即可：  
 
<jsp:include page="processbar.jsp"></jsp:include>  
 
注意哦， 只有当页面加载真的需要花费时间的时候才会看到效果。
wsrjzhsy0493
关注
页面加载时 提示 正在加载中
04-11
任何jsp页面只要使用包含附件中的loading.jsp将自动拥有“页面正在加载的。。”提示信息，在页面加载完后将自动隐藏
Web应用中实现页面加载提示
sclxf的专栏
11-11 1556
from : http://brofe.javaeye.com/blog/220784 在Java Web应用中， 当加载一个动态页面时及JSP页面时，如果页面动态数据较多，会有很长一段时间的空白页面，古加上这个页面正在加载的提示，使得应用更加人性化。processbar.jsp    "java" contentType="text/html; charset=UTF-8"      pageE
解决django -- Websocket无法连接问题
L-ji的博客
04-18 5018
这是Chrome报的错： WebSocket connection to 'ws://127.0.0.1:8000/md_admin/test_socket' failed: Error in connection establishment: net::ERR_CONNECTION_REFUSED 这是FF报的错： Firefox 无法建立到 ws://127.0.0.1:8000/md_ad...
基于javascript实现页面加载loading效果
10-22
但是，实际上在现代Web开发中，加载提示效果会更加丰富和多样，比如使用CSS动画、SVG图形，甚至可以利用JavaScript库如Ajax和jQuery来实现更为复杂和定制化的加载效果。 此外，文档中提到的“目标页”，应当是用户...
jquery实现ajax加载超时提示的方法
10-21
通过以上方式，我们可以有效地在jQuery的AJAX请求中实现超时提示，提供更好的用户交互体验。需要注意的是，实际应用中应根据网络环境和服务器性能合理设定超时时间，以平衡用户体验和系统资源的消耗。同时，确保在...
JS+CSS实现网页加载中的动画效果
10-19
本篇内容主要讲解如何使用JavaScript（JS）和层叠样式表（CSS）在网页加载过程中添加动画效果，以提供更好的用户体验。这种技术常用于在页面数据异步加载时展示一个“加载中”的提示，让用户知道后台正在进行处理。 ...
实现Web页面新消息实时提醒
liang0000zai的专栏
11-24 2万+
1.ajax方式   转载地址：
“正在加载”提示信息，WEB开发必备，loading...
05-13
正在加载提示信息，WEB开发必不可少的功能。
6种显示网页正在加载中的代码
03-20
6种显示网页正在加载中的代码,网页加载内页完成前显示正在加载...
web页面加载等待页面
12-17
该资源是web页面加载等待页面的一个模板，非常实用，页面很大众化，大家快来下载吧！^_^
java 页面加载提示_Web应用中实现页面加载提示
weixin_35090568的博客
02-13 329
processbar.jsppageEncoding="UTF-8"%>process bar//: 判断网页是否加载完成document.onreadystatechange = function () {if(document.readyState=="complete") {document.getElementById('divprogressbar').style.display=...
web页面加载时显示加载状态
shaily读书学习
02-06 1186
1. 加载进度条            Response.Write("");           Response.Write("_");           Response.Write("");           Response.Write("mydiv.innerText = ;");           Response.Write(";");           Respons
web页面加载、解析、渲染过程
weixin_30535843的博客
03-28 498
对web项目进行优化首先得知道浏览器是怎么工作的这里推荐how browsers work中文版； 一、浏览器 浏览器的主要功能是将用户选择的web资源呈现出来，它需要从服务器请求资源，并将其显示在浏览器窗口中，资源的格式通常是HTML，也包括PDF、image及其他格式。用户用URI（Uniform Resource Identifier统一资源标识符）来指定所请求资源的位置，通过DNS...
正在载入中......loading页面的几种方法
热门推荐
JackLiu16的博客
01-24 11万+
　　网页加载过程中提示“载入中…”，特别是使用动画效果，可以一个“等待”的温馨提示，用户体验很不错。下面介绍几种方法。 第一种：　　 原理就是,在网页载入时在页面最中间打入一个层上面显示,"网页正在载入中...."当网页下载完毕,,用JS关闭这个层......。 先在首页HTML最上面...任意位置都行..加入 &lt;div id=loading style="position:a...
Web页面提示、跳转
weixin_33892359的博客
07-09 337
一、在Asp.net中Response.write可以向客户端输出脚本，因此常用如下代码弹出对话框： Response.Write("<script>alert('注册成功！');</script>"); //屏蔽主页面后弹出对话框（关闭弹出对话框后主页面可能会显示混乱） 或者是 Page.ClientScript.RegisterStartupScript(Pag...
网页加载等待提示框实现
这种简单的等待提示框适用于简单的Web应用程序，特别是在执行如数据加载、提交表单等可能需要一段时间的操作时。然而，对于更复杂的场景，可能需要更高级的进度条或动画效果来提供更好的用户体验，例如使用CSS3动画...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值