关于html表单实现md5加密，input框长度变化的问题。

关于html表单实现md5加密，input框长度变化的问题。

问题描述：
今天在写html页面的时候，想实现一个登陆表单，考虑到表单提交数据的时候会以 name = value 的形式发送数据。
所以提交账号密码会存在一定的风险，所以想使用md5来进行密码加密，当然这不是传统的加密方式，在这里就简单一下。

在开发过程中我用jquery代码获得密码框内容，然后调用js的md5库加密，把密文写回到密码框，这是我们会发现密码框的长度会变长。
如下图：

md5加密后：

这是因为以下代码：

function login(){
    var password = $("#password").val() ;   // 密码加密
    $("#password").val($.md5(password));    // 密码重赋值
    return true ;
}

我原来的想法就是，将加密后的md5密码赋值给原来的password框，然后随post请求发往服务器。但是这种会出现很多问题。

问题：

• 当我们重复登陆的时候，会发现密码错误。现在的浏览器都有记住密码的功能，如果我们把md5密文写入password框，将会造成记住密码登陆不上的情况。
• 不符合我们实际情况，我们平时登陆的时候密码长度不会发生改变。

解决方案：
先亮代码，再说原理
html代码

<div class="col-sm-5">
	<input type="password" class="form-control" id="password" placeholder="请输入密码" >
    <input type="hidden" name="password_md5" id="password_md5">
</div>

function login(){
    var password = $("#password").val() ;
    $("#password_md5").val($.md5(password));
    return true ;
}

原理解析：
在html中吗，我们在密码框下额外定义了一个hidden类型的input框，这个框是不会显示在前端页面上的。所以我们用它来保存我们的加密后的密码。在js中，我们获得了密码原文进行加密后，将密文赋值给这个未显示的组件，这样就避免了这个问题。

服务器收到的请求信息：

感谢阅读！欢迎指教！