html+js实现输入用户名和密码点击登录跳转页面

2023-11-20

html+js实现:

  • 输入用户名和密码点击登录跳转其他页面
  • 这里主页是index.html
  • 跳转的页面名字是随机点名.html

1.index.html


<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>	
	用户名:<input type="text" id="name">
					<br/>
		密&nbsp; &nbsp; 码:<input type="text" id="pwd"><br />
		&nbsp; &nbsp; &nbsp; <input type="button" value="提交" onclick="confime()" />
		&nbsp; &nbsp; <input type="button" value="查看" onclick="displaycooikes()" />

<script>
	function confime(){
		var sname=document.getElementById("name").value
		var spwd=document.getElementById("pwd").value
		if(sname=="admin"&&spwd=="admin"){
			window.open("随机点名.html")
		}
		else
		{
			alert("用户名或密码错误!");		
		}
				
	}
	function displaycooikes(){
		var myname= new Array()
		var myvalue= new Array()
		var str=""
		var cookiesstring=document.cookie
		var cookiessarray = cookiesstring.split(";")
		for(var i=0;i<cookiessarray.length;i++){
			var cookienum= cookiessarray[i].split("=")
			myname[i]=cookienum[0]
			myvalue[i]=cookienum[1]
		}
		alert(cookiesstring)
		alert("cookies信息是"+myname[0]+myvalue[0]+myname[1]+myvalue[1])
	}
</script>
				 
	
	</body>
</html>

 2.随机点名.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<center>
		<div id="d">
			<div id="name" style="width: 40px;height: 50px;">
			
			</div>
			
			<button id='start' type="button" >开始</button>
			<button id='temp' type="button" >暂停</button>
		</div>
		</center>
	</body>
</html>
<script type="text/javascript">
window.onload=function(){
var names =['张三','李四','王五','王麻子','小红'];//人名数组
var clors =[ '#EE0000' ,'#CAE1FF' , '#008B8B' , '#CDC9C9', '#FOF8FF'];//颜色数组
var name = document.getElementById( 'name');//获取id为name的元素
var d = document.getElementById( 'd');
var temp = document.getElementById( 'temp');
var start = document.getElementById( 'start');
function Random(){//产生随机数,并更改h1中的内容与颜色
	var nNum = Math.floor(Math.random()*5);//这里的5为你当前人名的数量
	var cNum = Math.floor(Math.random()*5);
	name.innerHTML = names[nNum];
	d.style.color=clors[cNum];
}
start.onclick = function(){//单击开始方法
	startR = setInterval(Random, 25);//设置计时器,每0.025秒执行一次
}
temp.onclick = function(){//单击暂停方法
	clearInterval(startR);
}
}
	
</script>

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

html+js实现输入用户名和密码点击登录跳转页面 的相关文章

  • 如何强制折断不可折断的字符串?

    我有一个根据数据库中包含的数据生成的 HTML 页面 数据库有时包含浏览器无法分解的长字符串 因为这些字符串不包含可分解的字符 空格 点 逗号等 有没有办法使用 html css 甚至 javascript 来解决这个问题 看到这个link
  • 如何覆盖 bootstrap 表 td 样式?

    我正在使用 Bootstrap 3 3我有一个 HTML 代码如下 div table class table table striped tr td 03 td td 04 td td 05 td td 06 td td 07 td td
  • Angularjs 完整日历不显示事件

    我正在用那个https github com angular ui ui calendar https github com angular ui ui calendar在 Angularjs 中使用 FullCalendar 它显示日历并
  • 在按钮之间添加空间?

    嗨 我这里有一个代码 除了一件事之外 一切都很完美 代码中每个按钮之间没有空格 我尝试过 margin 但不幸的是它是一个无序列表 所以我有点困惑 我将添加或替换什么以在两个按钮之间留出空间 帮助
  • 如何在php中使用一张图像绘制形状

    我需要使用图像的一部分来创建帧图像 例如 用户将从后端上传图像片段 现在我需要根据前端用户的要求在前端创建一个框架 用户将选择框架的高度和宽度 然后他将选择该图像片段 如下所示 我没有办法做到这一点 我尝试通过 css 和 html can
  • Cosmos DB Mongo API 如何管理“请求率很大”情况

    我有以下代码 async function bulkInsert db collectionName documents try const cosmosResults await db collection collectionName
  • 游戏手柄 JavaScript 未能按预期更新

    我正在尝试让浏览器报告我的 XBOX 控制器的状态 然而 在第一次按下按钮后 它似乎变得 卡住 我究竟做错了什么
  • html canvas动画卡顿

    谁能解释为什么提供的画布动画断断续续 我创建了一个测试存根来演示该问题 我在桌面上的 FF Chrome IE 以及 Android 上的 FF 和 Chrome 中看到了卡顿现象 口吃是由于垃圾收集造成的吗 似乎 raf 在每次调用时都会
  • 宽度:适合内容;在 Chrome 上工作,但在资源管理器上不工作

    我构建了一个应用程序 所有内容都在 Chrome 中完美显示 但如果我在 Windows 资源管理器中打开该应用程序 容器会比应有的小 我在用着width fit content 这是只适用于 Chrome 的东西吗 我怎样才能使其适用于所
  • setInterval() 在用户离开选项卡时暂停?

    javascript 中是否有任何方法的行为类似于 setInterval 并且当用户离开选项卡时停止并在用户再次进入选项卡时恢复 您可以使用以下方法创建自己的 API可见性API https developer mozilla org e
  • ReactCSSTransitionGroup 组件WillLeave 未调用

    我尝试使用 ReactCssTransition 但不知何故该事件没有被调用 componentWillLeave 这是我的组件 import React Component from react import TransitionGrou
  • 自定义指令链接中的 element.replaceWith 仅在第一次调用时有效

    我是 Angularjs 的新手 不太了解幕后的情况 基本上我想创建一个 E 扭结指令 基于控制器中的数据 我动态创建html 就像整个 表 一样 以替换该指令 我的 html 文件中的指令是这样的
  • 使用 CSS 覆盖透明 div 中的不透明文本

    我试图使透明 div 内的文本没有不透明度 也就是全黑 div style background 3cc p style background 000 This text should be all black p div 只用 CSS 就
  • JavaScript 中的实时摩尔斯电码转换器

    在看到谷歌关于莫尔斯电码 gmail 的愚人节笑话后 我想我应该尝试用 javascript 创建一个实时莫尔斯电码转换器 我正在使用正则表达式和替换将莫尔斯电码更改为字符 例如 replace g a replace g r 我遇到的问题
  • Django 将 JSON 数据传递给静态 getJSON/Javascript

    我正在尝试从 models py 中获取数据并将其序列化为views py 中的 JSON 对象 模型 py class Platform models Model platformtype models CharField max len
  • 如何为 Imagus 悬停缩放扩展开发自定义过滤器?

    当我读到关于悬停缩放是邪恶的 http www reddit com r YouShouldKnow comments 1wjrc8 ysk that the hover zoom extension is spyware 哎呀 有两篇文章
  • 水平对齐输入字段

    我正在尝试获取一个输入字段 并且它与同一水平线上的关联提交按钮相关 但事实证明这是一个挑战 这是我的代码
  • 检测浏览器选项卡是否具有焦点

    是否有可靠的跨浏览器方法来检测选项卡是否具有焦点 场景是 我们有一个定期轮询股票价格的应用程序 如果页面没有焦点 我们可以停止轮询并为每个人节省流量噪音 特别是当人们喜欢打开具有不同投资组合的多个选项卡时 Is window onblur
  • 在具有多级分组的 HTML 表格中显示数据

    我必须通过使用 rowspan 进行分组来显示 HTML 表中的一些数据 下面是预期的 GUI 我有如下所示的 JSON 数据 JSON数据here https jsoneditoronline org id 1014438e5489485
  • JQuery 删除和内存泄漏

    我正在开发一个游戏 我看到了很多内存消耗 我使用jquery animate 动画完成后 我 remove 元素 我的问题是 从 dom 树中删除一个元素后 对象还存在记忆中吗 Javascript 是一种垃圾收集语言 这意味着当没有代码保

随机推荐

  • 在 CentOS 上安装 Docker Engine

    文章目录 在 CentOS 上安装 Docker Engine 先决条件 操作系统要求 卸载旧版本 安装方法 使用 rpm 存储库安装 设置存储库 安装 Docker Engine 安装最新版本 安装指定版本 以非 root 用户身份管理
  • js获取时间戳的四种方法

  • vscode使用手册

    VS Code Visual Studio Code 是一款轻量级 跨平台的源代码编辑器 支持语法高亮 自动补全 调试 Git 版本控制等功能 下面是一些使用 VS Code 的基本操作 安装和启动 在官网上下载并安装 VS Code 打开
  • react里面的接口调用方法

    react接口调用 我们通过npm create react app my app创建react项目 在项目里都是要进行接口调用来获取数据 进行增删改查各种操作的 所以掌握接口调用方式是非常必要的 话不多说进入正题 想要掌握接口调用的内里逻
  • 何恺明组《Designing Network Design Spaces》的整体解读(一篇更比六篇强)

    本文原载自知乎 已获原作者授权转载 请勿二次转载 https zhuanlan zhihu com p 122557226 statistics 大法好 DL不是statistics 因为DL不如statistics 基本全文从统计学的角度
  • 编程猫python讲师面试_【编程猫教师面试】笔试:试题+打字测速-看准网

    985师范本加硕 想要从事k12教育 坚挺到最后一轮但是未通过的小姐姐掩面飘过 来谈谈我的面试感受吧 个人觉得猫厂管培生的面试整体流程安排挺合理的 有感觉确实是在用心的挑选人才 然后所有的面试官都很nice 我是直接在boss直聘上投的简历
  • ffmpeg最简单的解码保存YUV数据

    文章转载自 http blog chinaunix net xmlrpc php r blog article id 4584541 uid 24922718 video的raw data一般都是YUV420p的格式 简单的记录下这个格式的
  • 技术英雄会【新闻】CSDN最有价值博客TOP10颁奖【图】【我在左边数第四个】

    2007年04月06日 10 04 新浪科技夹带些私货 呵呵 社区英雄会 一 问周鸿祎一个问题 社区英雄会 二 问CSDN一个信息过滤器的问题 技术英雄会 三 社区英雄们的与会感言大赏 技术英雄会 四 也谈如何发掘到需要的内容和英雄 图为
  • linux_compress

    tar 解包 tar xvf FileName tar 打包 tar cvf FileName tar DirName 注 tar是打包 不是压缩 gz 解压1 gunzip FileName gz 解压2 gzip d FileName
  • 调试器GDB的基本使用方式(一)

    GDB的功能及其丰富 我们按照调试的流程进行说明 基本用法很简单 流程如下所示 带着调试选项编译 构建调试对象 启动调试器 GDB 设置断点 显示栈帧 显示值 继续执行 一 准备 通过 gcc 的 g 选项生成调试信息 gcc Wall O
  • Qt bool转QString再转回bool方法

    可能在传递参数的过程中 传的一是个bool值 而后面 在参数的转换传递过程中 只能传一个QString 最后又需要得到一个bool值 这时就可以使用这种方法 bool testParam QString tempParam QString
  • matlab傅里叶变换漫谈

    Introduction 由于research需要 不得已开始回顾关于高数的基本知识 写在这里方便记录 这个故事告诉我们 What goes around comes around meaning that life has a funny
  • java二维数组随机赋值_java 二维数组随机赋值

    java 二维数组随机赋值 2021 01 31 00 08 55 简介 目的 使用二维数组打印一个 10 行杨辉三角 视频教程推荐 java课程 思路 1 第一行有 1 个元素 第 n 行有 n 个元素 2 每一行的第一个元素和最后一个元
  • HTML头部

    目录 实例 HTML 元素 HTML
  • Linux命令·rm

    linux中删除文件和目录的命令 rm命令 rm是常用的命令 该命令的功能为删除一个目录中的一个或多个文件或目录 它也可以将某个目录及其下的所有文件及子目录均删除 对于链接文件 只是删除了链接 原有文件均保持不变 rm是一个危险的命令 使用
  • angular2 Http请求

    提供HTTP服务 HttpModule并不是Angular的核心模块 它是Angular用来进行Web访问的一种可选方式 并位于一个名叫 angular http的独立附属模块中 编辑app module ts import HttpMod
  • Fortran基础1——声明及数据类型

    声明及数据类型 一 声明的意义 告诉编译器要预留一些存放数据的内存空间 二 基本数据类型 数据类型 描述 整数 integer a 浮点数 real a 字符 character a 逻辑变量 logical a 复数 complex a
  • 程序员的自我修养——链接、装载与库

    1 温故而知新 操作系统概念 北桥 连接高速芯片 系统调用接口 以软件中断的方式提供 如Linux使用0x80号中断作为系统调用接口 多任务系统 进程隔离 设备驱动 直接使用物理内存的弊端 地址空间不隔离 内存使用效率低 程序运行的地址不确
  • httpclient 聚合

    文章目录 依赖 DefaultHttpClient 废弃 设置代理 传文件 HttpClientUtil version 4 3 6 依赖
  • html+js实现输入用户名和密码点击登录跳转页面

    html js实现 输入用户名和密码点击登录跳转其他页面 这里主页是index html 跳转的页面名字是随机点名 html 1 index html 用户名