PHP+HTML实现登出界面倒计时效果

举报
eastmount 发表于 2022/08/31 20:42:41 2022/08/31
【摘要】 在WAMP(Windows+Apache+MySQL+PHP)做网站时，通常需要使用Session记录表单登陆用户名和密码等变量，而在登出时需要清除Session。通常我想实现的登出是通过alert提示用户然后header跳转，但下面的代码是通过JavaScript实现的时间倒计时并跳转到主页的效果。

​        在WAMP(Windows+Apache+MySQL+PHP)做网站时，通常需要使用Session记录表单登陆用户名和密码等变量，而在登出时需要清除Session。通常我想实现的登出是通过alert提示用户然后header跳转，但下面的代码是通过JavaScript实现的时间倒计时并跳转到主页的效果，主要是看到学校的BT网站等都是这个效果。
        PS:参考 C# 系统应用之Cookie\Session基础知识及php读取Cookie\Session
        代码如下：

<?php
	session_start();
	session_destroy(); //清空以创建的所有SESSION
	setcookie(session_name(),'',time()-1); 
	$_SESSION = array();
?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>登出系统</title>
<link  href="css/mycss.css" type="text/css" rel="stylesheet"/>
</head>
<body>	
<div id="main">
<TABLE cellSpacing=0 cellPadding=0 width="100%" 
		background="images/header_bg.gif" border=0>
	<!--头部图片-->
  <TR height=80>
    <TD width=260>
    	<IMG height=80 src="images/logo.gif" width=260>
    </TD>
</TABLE>
<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
  <TR bgColor=#1c5db6 height=20>
    <TD></TD></TR>
</TABLE>
<!-- 布局中部 -->
<div id="middle">
<div id="logout_middle">
	<H3 style="COLOR: #880000">注销成功</H3>
	<H4>您已经登出系统！欢迎下次登录!<br />系统将在
	<input type="text" style='font-size:18px; border:0px; width:20px;' 
		readonly="true" value="5" id="time">秒后返回主页游客查看界面
	</H4>
</div>
<!-- 时间函数 -->
<script language="javascript">
	var t = 5;
	var time = document.getElementById("time");
	function fun()
	{
		t--;
		time.value = t;
		if(t<=0)
		{
			location.href="index.php";
			clearInterval(inter);
		}
	}
	var inter = setInterval("fun()",1000);
</script>
</body>
</html>

        实现的效果如下：

​
        最后希望文章对大家有所帮助，也尝试不同风格，写点短文章。

        感恩能与大家在华为云遇见！
        希望能与大家一起在华为云社区共同成长，原文地址：https://blog.csdn.net/Eastmount/article/details/126370183
        (By:Eastmount 2022-08-31 夜于贵阳 http://blog.csdn.net/eastmount/ )
【版权声明】本文为华为云社区用户原创内容，未经允许不得转载，如需转载请自行联系原作者进行授权。如果您发现本社区中有涉嫌抄袭的内容，欢迎发送邮件进行举报，并提供相关证据，一经查实，本社区将立刻删除涉嫌侵权内容，举报邮箱： cloudbbs@huaweicloud.com
HTML PHP
  • 点赞
  • 收藏
  • 关注作者

评论（0）

0/1000
抱歉，系统识别当前为高风险访问，暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称，即可参与社区互动！

*长度不超过10个汉字或20个英文字符，设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符，设置后3个月内不可修改。

确认 取消

加入云驻计划，成为创作者

  • 华为云周边好礼
  • 免费体验产品
  • 特殊身份标识
  • 线下官方门票
  • 内部专家零距离
  • 与10000+优质创作者共同成长
立即加入