javascript form验证、完善 第24节
<html>
<head>
<title>Form对象</title>
<style type="text/css">
#tip {
width:100px;
/* line-height:20px; */
background-color:white;
/*color:red;*/
border:1px solid red;
display:none;
font-size:12px;
text-align:center;
padding:3px;
} </style>
<script type="text/javascript">
function $(id) {
return document.getElementById(id);
}
function setDays() {
//获取year month
var year = +$("year").value ;
var month = +$("month").value;
//alert(year + "\n" + month);
//计算月的天数
var days = getMonthDays(year, month);
var currentDay = new Date().getDate();
//alert(days);
//输出天数
var oSelect = $("days");
oSelect.options.length = days;
for(var i = 0; i < days ; i++ ) {
oSelect.options[i].text = i + 1;
oSelect.options[i].value = i + 1;
console.log(currentDay ,i);
if(i == currentDay) {
console.log("===============",currentDay ,i);
oSelect.options[i].setAttribute("selected","selected");
}
} }
function getMonthDays( year , month) {
if(month == 2 && (year % 400 == 0 || year %4 == 0 && year % 100 != 0)) {
return 29;
}
var a = [0,31,28,31,30,31,30,31,31,30,31,30,31];
return a[month];
}
//表单验证
function checkForm(oForm) {
//检测用户名
var name = oForm.username.value; var pwd = oForm.password.value;
// var name = oForm.elements["username"] .value;
// alert(name);
if(name == null || name == "") {
alert("用户名不能为空");
oForm.username.focus();
return false;
} if(pwd == null || pwd == "") {
alert("密码不能为空");
oForm.username.focus();
return false;
}
//全部验证通过
return true; } function check(username) { if(username == null || username == "" ) {
$("tip").innerHTML = "用户名不能为空";
$("tip").style.color="blue";
$("tip").style.display="inline";
oForm.username.focus();
return;
}
if(username.length < 6) {
$("tip").innerHTML = "用户名长度不能少于6个";
$("tip").style.color="blue";
$("tip").style.display="inline";
oForm.username.focus();
return;
}
$("tip").innerHTML = "用户名合法";
$("tip").style.display="inline";
$("tip").style.color="green";
}
</script>
</head>
<body onload="setDays()">
<div>表单验证</div>
1.</br>
<form action="事件.htm" method="GET" name="form1" onsubmit="return checkForm(this)" >
<table border="1" width="500px" cellpadding="5" cellspacing="0" align="left">
<tr>
<th colspan="2">注册表</th>
</tr>
<tr>
<td align="right">姓名:</td>
<td><input type="text" name="username" onblur="check(this.value)" />
<span id="tip"></span>
</td>
</tr>
<tr>
<td align="right">密码:</td><td><input type="password" name="password"/></td>
</tr>
<tr>
<td align="right">性别:</td>
<td>
<input type="radio" name="sex" value='男' checked="checked"/>男
<input type="radio" name="sex" value='女'/>女
</td>
</tr>
<tr>
<td align="right">出生日期:</td>
<td>
<select name="year" id="year" onchange="setDays()">
<script type="text/javascript">
var d = new Date();
var y = d.getFullYear();//系统当前日期
var m = d.getMonth() + 1;
//alert(y);
for(var i = y - 20; i < y + 10; i++ ) {
if(i == y) {
document.write("<option value='"+i+"' selected='selected'> " + i + "</option>");
} else {
document.write("<option value='"+i+"'> " + i + "</option>");
}
}
</script>
</select> <select name="month" id="month" onchange="setDays()">
<script type="text/javascript">
for(var i = 1; i < 13; i++ ) {
if(i == m) {
document.write("<option value='"+i+"' selected='selected'> " + i + "</option>");
} else {
document.write("<option value='"+i+"'> " + i + "</option>");
}
}
</script>
</select> <select name="days" id="days"> <script type="text/javascript">
/*
for(var i = 1; i < 32; i++ ) {
document.write("<option value='"+i+"'> " + i + "</option>");
}
*/
</script>
</select>
</td>
</tr>
<tr>
<td align="right">爱好:</td>
<td>
<input type="checkbox" name="loves" value='足球' checked="checked"/>足球
<input type="checkbox" name="loves" value='看书' />看书
<input type="checkbox" name="loves" value='旅游' />旅游
<input type="checkbox" name="loves" value='游戏' />游戏
</td>
</tr> <tr>
<td align="right">班级:</td>
<td>
<select name="clazz">
<option value="clazz1">clazz1</option>
<option value="clazz2" selected="seleted">clazz2</option>
<option value="clazz3">clazz3</option>
<option value="clazz4">clazz4</option>
</select>
</td>
</tr> <tr>
<td align="right">照片:</td>
<td>
<input type="file" name="photo" size="40"/>
</td>
</tr>
<tr>
<td align="right">个人简历:</td>
<td>
<textarea rows="6" cols="40" name="intro">请输入....
</textarea>
</td>
</tr> <tr>
<td colspan="2" align="center">
<input type="submit" value="登陆"/>
<input type="reset" value="重填"/> <input type="hidden" name="hidden" value="yfs" />
</td>
</tr>
</table>
</form> </body>
</html>
rs:
javascript form验证、完善 第24节的更多相关文章
- Nodejs之MEAN栈开发（四）---- form验证及图片上传
这一节增加推荐图书的提交和删除功能,来学习node的form提交以及node的图片上传功能.开始之前需要源码同学可以先在git上fork:https://github.com/stoneniqiu/R ...
- tornado web高级开发项目之抽屉官网的页面登陆验证、form验证、点赞、评论、文章分页处理、发送邮箱验证码、登陆验证码、注册、发布文章、上传图片
本博文将一步步带领你实现抽屉官网的各种功能:包括登陆.注册.发送邮箱验证码.登陆验证码.页面登陆验证.发布文章.上传图片.form验证.点赞.评论.文章分页处理以及基于tornado的后端和ajax的 ...
- form验证及图片上传
form验证及图片上传 这一节增加推荐图书的提交和删除功能,来学习node的form提交以及node的图片上传功能.开始之前需要源码同学可以先在git上fork:https://github.com/ ...
- python自动化开发-[第二十一天]-form验证,中间件,缓存,信号,admin后台
今日概要: 1.form表单进阶 2.中间件 3.缓存 4.信号 5.admin后台 上节课回顾 FBV,CBV 序列化 - Django内置 - json.dumps(xxx,cls=) Form验 ...
- 本博文将一步步带领你实现抽屉官网的各种功能：包括登陆、注册、发送邮箱验证码、登陆验证码、页面登陆验证、发布文章、上传图片、form验证、点赞、评论、文章分页处理以及基于tronado的后端和ajax的前端数据处理。
本博文将一步步带领你实现抽屉官网的各种功能:包括登陆.注册.发送邮箱验证码.登陆验证码.页面登陆验证.发布文章.上传图片.form验证.点赞.评论.文章分页处理以及基于tronado的后端和ajax的 ...
- javascript form表单常用的正则表达式
form验证时常用的几个正则表达式 座机: \d{3,4}-\d{7,8} 手机号: /^1[34578][0-9]{9}$/ (\86)?\s+1[34578]\d{0-9} (\+86)?\s*1 ...
- Python Django的分页，Form验证，中间件
本节内容 Django的分页 Form 中间件 1 Django 分页 1.1 Django自带的分页 1.首先来看下我的测试数据环境 ############ models.py ######### ...
- JavaScript 初学者应知的 24 条最佳实践
原文:24 JavaScript Best Practices for Beginners (注:阅读原文的时候没有注意发布日期,觉得不错就翻译了,翻译到 JSON.parse 那一节觉得有点不对路才 ...
- 关于去除Eclipse对JavaScript的验证
关于去除Eclipse对JavaScript的验证 在我们使用大量JavaScript作为一些UI或其他组件来使用时,很多情况下,明明引用的这些JavaScript是可以正常使用的,但Eclipse却 ...
随机推荐
- Javascript(jQuery)中绑定页面上所有按钮点击事件的几种方式
方法一:使用document对象查找所有的按钮 [javascript] view plain copy 在CODE上查看代码片派生到我的代码片 //按照dom的方式添加事件处理 function B ...
- OpenCV入门学习笔记
OpenCV入门学习笔记 参照OpenCV中文论坛相关文档(http://www.opencv.org.cn/) 一.简介 OpenCV(Open Source Computer Vision),开源 ...
- metasploit(MSF)终端命令大全
show exploits 列出metasploit框架中的所有渗透攻击模块. show payloads 列出metasploit框架中的所有攻击载荷. show auxiliary 列 ...
- linux就是这个范儿之融于心而表于行(1)
原创作品,允许转载,转载时请务必以超链接形式标明文章原始出处 .作者信息和本声明.否则将追究法律责 时间总是过得那么快,如流水一般哗啦啦的就淌走了一大堆!周遭事事沧桑变迁喧哗或耳语中流传的故事已渐模糊 ...
- Android下pm命令详解
在看相关PackageManager代码时,无意中发现Android 下提供一个pm命令,通常放在/system/bin/下.这个命令与Package有关,且非常实用.所以研究之. 0. Usage: ...
- ios的NSMutableString用法
版权声明:本文为博主原创文章,未经博主允许不得转载. 详见代码: // // main.m // Foundation5-NSMutableString // // Created by mj ...
- 文件和目录之chmod和fchmod函数
本篇博文内容摘自<UNIX环境高级编程>(第二版),仅作个人学习记录所用.关于本书可参考:http://www.apuebook.com/. 这两个函数使我们可以更改现有文件的访问权限: ...
- Tomcat 配置 Probe 监控
转至:http://9771104.blog.163.com/blog/static/19446622009811112836524/ 手上接触Tomcat的项目越来越多,虽说tomcat的manag ...
- linux服务器命令
清除屏幕数据:ctrl + l :快速查找某个文件: find / -name 'httpd.conf' (或php.ini) 重启Apache : service httpd restar ...
- 实例源码--Android智能家居系统源码
下载源码 技术要点: 1.Android应 用开发基础框架 2.SQLITE数据库的 使用 3.网络通信 4.GOOGLE地图模块 5.源码带有非常详 细的中文注释 ...... 详细介绍: ...