zoukankan      html  css  js  c++  java
  • HTML 实录 <一>

    注册表单的实现

    <style>
    th, td {
    	text-align: left;
    	padding: 8px 4px;
    }
    </style>
    
    	<form action="?request=register" method="post">
    		<table style="margin: auto">
    			<tr>
    				<td>用户名:</td>
    				<td><input width="auto" type="text" required="required" autocomplete="username"
    					name="name"></td>
    			</tr>
    			<tr>
    				<td>密码:</td>
    				<td><input width="auto" type="password" required="required" autocomplete="new-password"
    					id="form_passwd" name="passwd"></td>
    			</tr>
    			<tr>
    				<td>确认密码:</td>
    				<td><input width="auto" type="password" required="required" autocomplete="new-password"
    					id="form_passwd_two" name="passwd"></td>
    			</tr>
    		</table>
    		<br>
    		<button type="submit">注册</button>
    	</form>
    

    效果:

    监听密码输入框 input 输入事件

    	<script type="text/javascript">
    		// 验证密码长度
    		var form_passwd = document.getElementById("form_passwd");
    		form_passwd.addEventListener("input", function () {
    			if(this.value.length < 6 || this.value.length > 20){ // 判断条件完全自定义
    	        	this.setCustomValidity('密码格式不正确, 长度6~20');
    	        }else {
    	        	this.setCustomValidity("");
    	        }
    		});
    	</script>
    

  • 相关阅读:
    VMI
    jsp环境搭建(Windows)
    128M小内存VPS优化与typecho环境搭建
    Shell字符串
    bash和sh区别
    PHPDocument 代码注释规范总结
    PHP 程序员的技术成长规划
    JavaScript:JSON
    mongoDB 使用手册
    PHP面向对象的标准
  • 原文地址:https://www.cnblogs.com/develon/p/10833715.html
Copyright © 2011-2022 走看看