本篇文章给大家介绍HTML实现简单登录页面的方式。有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。
这是一个简单的静态的html页面登录图片，之前写的，验证码方面没有搞懂，这里我重新参考了这里，但是部分功能还没有完善。仅供参考
静态页面登录测试 window.onload = function() { createCode() } var code; //在全局定义验证码 function createCode() { code = ""; var codeLength = 4; //验证码的长度 var checkCode = document.getElementById("code"); var random = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'); //随机数 for(var i = 0; i < codeLength; i++) { //循环操作 var index = Math.floor(Math.random() * 36); //取得随机数的索引（0~35） code += random[index]; //根据索引取得随机数加到code上 } checkCode.value = code; //把code值赋给验证码 } //校验验证码 function validateLogin(){ var sUserName = document.frmLogin.username.value ; var sPassword = document.frmLogin.password.value ; var inputCode = document.frmLogin.text_code.value; /*var sinputCode =document.frmLogin.inputcode.value ; */ if ((sUserName.length <= 0) || (sUserName=="")){ alert("请输入用户名!"); return false ; } if ((sPassword.length <= 0) || (sPassword=="")){ alert("请输入密码!"); return false ; } if ((inputCode.length<= 0) || (inputCode==NULL)){ alert("请输入验证码!"); return false ; } }
执行后如图
推荐学习：html视频教程
以上就是HTML如何实现简单登录页面的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1549579.html
微信扫一扫 
支付宝扫一扫 
