根据填入日期自动算年龄

框架说明:使用layui框架的日期插件实现,其他的应该也是可以实现的

form表单节选

<div class="layui-row">
				<div class="layui-form-item ">
					<div class="layui-col-xs3 layui-col-sm3 layui-col-md3">
						<label class="layui-form-label">出生日期</label>
					</div>
					<div class="layui-col-xs1 layui-col-sm1 layui-col-md1">
						<label class="layui-form-label">:</label>
					</div>
					<div class="layui-col-xs8 layui-col-sm8 layui-col-md8">
						<input type="text" name="birth" id="birth" lay-verify="date"
							placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input"
							readOnly>
					</div>
				</div>
			</div>
			 <div class="layui-row">
				<div class="layui-form-item ">
					<div class="layui-col-xs3 layui-col-sm3 layui-col-md3">
						<label class="layui-form-label">年龄</label>
					</div>
					<div class="layui-col-xs1 layui-col-sm1 layui-col-md1">
						<label class="layui-form-label">:</label>
					</div>
					<div class="layui-col-xs8 layui-col-sm8 layui-col-md8">
						<input type="text" name="age" id="age"
							lay-verify="required|number" placeholder="点击这里自动获取年龄"
							autocomplete="off" class="layui-input" onfocus="countAge()"
							readOnly>
					</div>
				</div>
			</div> 

 

js代码段

//根据输入的日期 计算年龄
	 function countAge() {
		var birth = document.getElementById("birth").value;
		var r = birth.match(/^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2})$/);
		if (r == null)
			return false;
		var d = new Date(r[1], r[3] - 1, r[4]);
		if (d.getFullYear() == r[1] && (d.getMonth() + 1) == r[3]
				&& d.getDate() == r[4]) {
			var Y = new Date().getFullYear();
			var age = Y - r[1];
			if (age >= 18) {
				document.getElementById("age").value = age;
			} else {
				layer.msg("请输入正确的出生日期!");
			}
		}
	} 

 

转载于:https://my.oschina.net/zhongshg/blog/1788369