参考:https://www.jb51.net/article/132729.htm

获取sessionStorage的意义

首先获取它是为了将获得的信息输出或者alert();让人容易看到,

其次,在静态页面中,如果使用sessionStorage就相当于在动态页面里连接了数据库一样

例如:我上一篇所做的为button按钮添加回车事件的项目中所用到的可以使用js中的sessionStorage获取页面输入的信息,也可以获得后台计算所得的数据,并且显示出来。

废话不多说,看代码重要:

具体实现

<script type="text/javascript">
function login(){
var username=window.document.getElementById("username").value;
var password=window.document.getElementById("password").value;
if(password=="123456")
{
window.sessionStorage.setItem("username", username);
window.location.href="../index1.html" rel="external nofollow" ;
}else{
alert("密码错误请输入正确的密码,例如:123456!");
return false;
}
}
</script>
<input type="text" id="username" class="11" placeholder="请输入真实姓名"/>
<input type="password" id="password" placeholder="请输入密码(默认密码123456)"/>
<input type="button" value="登录考试" onclick="login()">

以上代码是获取username的值并传到下一个界面

并且获得password的值与事先设置好的对比,不同就是错误 就不可以登录

<script>
$(function () {
var username= window.sessionStorage.getItem("username")
$("#yhm").html("登录用户:"+username)
$("#name").html(username)
if(window.sessionStorage.getItem("username")===null){
alert("您还没有登录,请登录后重试!")
window.location.href="Pages/index.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" ;
}
$("#esc").on("click",function(){
window.sessionStorage.clear();
window.location.href="Pages/index.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" ;
});
})
</script>

获取前段页面输入的值并且显示至对应的位置

<div id="yhm"></div>

并且判断是否有sessionStorage的值,如果没有,自动返回登录页面,并做出相应的提示

点击事件触发后清空sessionStorage的值

<script>
$("#esc").on("click",function(){
window.sessionStorage.clear();
window.location.href="Pages/index.html" rel="external nofollow" rel="external nofollow" rel="external nofollow" ;
});
</script>

当点击id为esc的按钮时触发clear事件

<button id="esc" style="background-color: #FF0000">退出考试系统</button>

则自动返回登录界面

使用JS获取SessionStorage的值的更多相关文章

  1. JS获取select的值

    记录一下JS获取select的value值和选项值 <select id="video_status"> <option value="1" ...

  2. Js获取元素样式值(getComputedStyle&currentStyle)兼容性解决方案

    因为:style(document.getElementById(id).style.XXX)只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的. 一般js获取内部样式和外部样式使用 ...

  3. js获取元素属性值为空的原因和解决办法

    问题描述:js获取某元素的属性值为空 代码: <!-- css定义在head中 --> <style> #box{ width: 100px; height: 100px; b ...

  4. ASP.NET中图片验证码与js获取验证码的值

    现在的程序中,为了防止用户恶意点击,我们一般都会加上验证,现在比较普遍的是加上图片验证码或者手机短信验证.验证码一般都是防机器不防人,有效的防止了恶意点击. 那么在webform中如何生成动态的图片验 ...

  5. JS获取元素CSS值的各种方法分析

    先来看一个实例:如何获取一个没有设置大小的字体? <!DOCTYPE html> <html lang="en"> <head> <met ...

  6. js 获取select的值 / js动态给select赋值

    jQuery获取Select选择的Text和Value:语法解释:1. $("#select_id").change(function(){//code...});   //为Se ...

  7. js获取文件MD5值

    原文链接:http://www.jianshu.com/p/940a9226fbbd   要在web页面中计算文件的md5值,还好这个项目是只需兼容现代浏览器的,不然要坑死了. 其实对文件进行md5, ...

  8. js获取table的值,js获取td里input的值

    1.如果想让table具有可以编辑的功能,可以在table里嵌入input标签 写法{{ list_one[1] or '' }}的作用是,当list_one[1]取值为None时,前端web界面不至 ...

  9. JS获取元素CSS值

    一.getComputedStyle getComputedStyle 是一个可以获取当前元素所有最终使用的CSS属性值.返回的是一个CSS样式声明对象([object CSSStyleDeclara ...

随机推荐

  1. python使用笔记29--代码驱动

    1 import unittest 2 import requests 3 import jsonpath 4 import time 5 import nnreport 6 7 def get_va ...

  2. VS Code 下载安装并设置中文面板显示

    下载: 下载地址:https://code.visualstudio.com/ 微软在2015年4月30日Build 开发者大会上正式宣布了 Visual Studio Code 项目:一个运行于 M ...

  3. 三、k8s集群可用性验证与调参(第一章、k8s高可用集群安装)

    作者:北京小远 出处:http://www.cnblogs.com/bj-xy/ 参考课程:Kubernetes全栈架构师(电脑端购买优惠) 文档禁止转载,转载需标明出处,否则保留追究法律责任的权利! ...

  4. Jmeter之事务控制器

    性能测试的结果统计时我们一定会关注TPS,TPS代表的是每秒事务数,每个事务对应的是我们的请求.虽然JMeter能够帮我们把每个请求统计成一个事务,但有时候我们希望把多个操作统计成一个事务,JMete ...

  5. fork、父进程和子进程

    进程 什么是进程?进程是一个运行中的程序实体,拥有独立的堆栈.内存空间和逻辑控制流. 这是标准的进程概念.让我们通过操作系统的fork函数看看这个抽象的概念是怎么在进程的实现中体现出来的. 构成要素 ...

  6. java网络编程基础——TCP网络编程三

    AIO实现非阻塞通信 java7 NIO2 提供了异步Channel支持,这种异步Channel可以提供更高效的IO,这种基于异步Channel的IO被称为异步IO(Asynchronous IO) ...

  7. SpringBoot之yaml语法及静态资源访问

    配置文件-yaml 在spring Boot开发中推荐使用yaml来作为配置文件. 基本语法: key: value:kv之间有空格 大小写敏感 使用缩进表示层级关系 缩进不允许使用tab,只允许空格 ...

  8. StringIO和BytesIO的用法

    数据读写有两种方式: 1.直接读写.案例 import openpyxl def write_excel(): f = openpyxl.Workbook() # 创建工作簿 # sheet1 = f ...

  9. odoo里面条件写法

    attrs="{'invisible': ['|', ('probability', '>', 0), ('active', '=', True)]}"/>. 写法gt ...

  10. 多项式求值问题(horner规则)——Python实现

    # 多项式求值(Horner规则) # 输入:A[a0,a1,a2...an],x的值 # 输出:给定的x下多项式的值p   # Horner迭代形式实现 1 # 在此修改初值 2 A = [2, 6 ...