zoukankan      html  css  js  c++  java
  • 表单验证和MD5加密

    表单验证和MD5加密

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <!--使用md5加密-->
        <script src="https://cdn.bootcss.com/blueimp-md5/2.12.0/js/md5.min.js"></script>
    </head>
    <body>
    <form action="http://baidu.com" method="post" onsubmit="return check()">
        <p>
            <span>用户名:</span><input type="text" id="username" name="username">
        </p>
        <p>
            <!--明文密码,会被network中直接抓取-->
            <span>密码:</span><input type="password" id="input-password">
        </p>
        <!--md5密码-->
        <input type="hidden" id="md5-password" name="password">
        <input type="submit" value="登录">
    </form>
    
    <script>
        function check() {
            var uname = document.getElementById('username');
            var pwd = document.getElementById('input-password');
            var md5pwd = document.getElementById('md5-password');
            md5pwd.value = md5(pwd.value);
            //控制台输出测试
            console.log(uname.value);
            console.log(pwd.value);
            console.log(md5pwd.value);
            //return false回阻止提交
            return true;
        }
    </script>
    
    </body>
    </html>
    

    id=md5-password的input的name=password,而id=password的input中没有name属性,而没有name属性的input的数据不会被提交

  • 相关阅读:
    【HTML】使用css3和html给网站添加上春节灯笼特效
    【CSS】学习笔记2 字体设置
    【CSS】学习笔记3 段落设置
    【CSS】学习笔记1 使用CSS样式表
    正则
    图片懒加载
    uni-app-组件
    uni-app-condition(条件)启动模式
    uni-app-页面
    uni-app项目目录和开发规范
  • 原文地址:https://www.cnblogs.com/pinked/p/12267529.html
Copyright © 2011-2022 走看看