关于form表单提交

　

表单提交

<!--HTML-->
<form id='test_form' action='' method='' onsubmit='return checkForm()'>
    <input type='text' name='username' value=''/>
    <input type='password'  id='input_pwd' value =''/>
    <input type='hidden' name='pwd' id='md5_pwd' value=''/>
    <button type='submit'>提交<button/>
<form/>

<script>
function checkForm(){
    var input_pwd= document.getElementById('input_pwd');
    var md5_pwd= document.getElementById('md5_pwd');
     md5_pwd.value= toMD5(input_pwd.value);            
    //进行下一步
    return ture;
}
<script/>

1. form表单的onsubmit属性定义了表单提交前需要调用的function, 若该function返回true,则提交表单,否则不予提交.
2. onsubmit属性: return function() 的return不能省略, 否则表单永远会提交.
3. form表单中password输入框没有name属性, 将不会被提交.
4. 从验证表单的function可以看出, 用户输入的password被MD5加密后返回给md5_pwd, 最终提交使用md5加密后的password.
5. 若将password加密后直接返回给input_pwd, 用户提交后会发现密码输入框变成了32个*号, 于是这里使用了input输入框的hidden属性, 与password属性配合使用, 改善用户体验

相关阅读