首页 > 代码库 > 简单的祖册
简单的祖册
学习JavaScript,练习其中的案例
一个简单的注册
<!DOCTYPE html> <html ng-app> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> table { margin: 20px auto; background: rgba(126,126,126,.8); text-align: center; } table tr td { padding: 3px; background: #fff; } table tr td:first-child { text-align: left; } table tr:last-child td:first-child { text-align: center; } input[type="text"], input[type="password"] { border: 1px solid #ccc; border-radius: 4px; padding: 8px 5px; outline: none; } select { width: 100px; height: 30px; } </style> </head> <body> <table> <tr> <td>姓名</td> <td><input type="text" name="username" id="username" placeholder="请输入用户名" /></td> </tr> <tr> <td>电话</td> <td><input type="text" name="phone" id="phone" placeholder="请输入电话" /></td> </tr> <tr> <td>密码</td> <td><input type="password" name="pass" id="pass" /></td> </tr> <tr> <td>确认密码</td> <td><input type="password" name="apass" id="apass" onblur="checkPass()" /></td> </tr> <tr> <td>性别</td> <td> <input type="radio" name="sex" id="man" value="男" /><label for="man">男</label> <input type="radio" name="sex" id="women" value="女" /><label for="women">女</label> </td> </tr> <tr> <td>学历</td> <td> <select name="school" id="school"> <option value="大学">大学</option> <option value="高中">高中</option> <option value="初中">初中</option> </select> </td> </tr> <tr> <td colspan="2"> <input type="submit" name="submit" id="submit" value="提交" onclick="getId()" /> <input type="reset" name="reset" id="reset" value="重置" /> </td> </tr> </table> <script type="text/javascript"> function $(id){ return document.getElementById(id); } function checkPass(){ var o = ($(‘pass‘).value == $(‘apass‘).value); if (o) { return true; } else{ alert("密码不一致"); return false; } o = null; } function getId(){ var str = ‘‘; str += "用户名:"; str += $(‘username‘).value; str += "\n电话:"; str += $(‘phone‘).value; str +=‘\n性别:‘; str += $(‘man‘).checked ? ‘男‘:‘女‘; str += ‘\n学历:‘; str += $(‘school‘).value; alert(str); } </script> </body> </html>
简单的祖册
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。