编程语言
首页 > 编程语言> > JavaScript小汇（9）—— 操作表单

JavaScript小汇（9）—— 操作表单

作者：互联网

文章目录

操作表单

获值
<form action="#" method="post">
    <span>用户名：</span><input type="text" /><br />
    <span>性别：</span>
    <input type="radio" name="gender" id="gender" value="woman" />女
    <input type="radio" name="gender" id="gender" value="man" />男
</form>
		
var un=document.getElementsByTagName('input')[0];
un.value;//获取表单提交的值
>"123"

var w =document.getElementsByTagName('input')[1];
w.value;
>"woman"

在这里插入图片描述

w.checked;
>true

var m=document.getElementsByTagName('input')[2];
m.checked=true;

在这里插入图片描述

md5加密
https://cdn.bootcss.com/blueimp-md5/2.10.0/js/md5.min.js" type="text/javascript

<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="https://cdn.bootcss.com/blueimp-md5/2.10.0/js/md5.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
    <form action="#" method="post" onsubmit="return sub()"><!--表单级别提交-->
        <p>
            <span>用户名：</span><input type="text" name="un" id="u"/>
        </p>
        <p>
            <span>密码：</span><input type="password" id="p"/>
        </p>
        <input type="hidden" name="pwd" id="md5_pwd"  />
        <button type="submit" onclick="sub()">提交</button>
    </form>
    <script type="text/javascript">
        function sub(){
            var un = document.getElementById('u');
            var pwd = document.getElementById('p');
            var md5_pwd = document.getElementById('md5_pwd');
            console.log(un.value);
            md5_pwd.value=md5(pwd.value);//解决了密码框中输入变长的现象
            //可以校验表单内容，true通过提交  false阻止提交
            //return false;
        }
    </script>
</body>

如有不对的地方欢迎大家指出，共同进步！

标签：小汇,JavaScript,value,表单,pwd,var,document,md5
来源： https://blog.csdn.net/weixin_45734378/article/details/113539493