`
miaoge
  • 浏览: 109329 次
  • 性别: Icon_minigender_1
  • 来自: 嘉兴
社区版块
存档分类

JavaScript日历代码,验证页面表单输入数据代码

阅读更多

下载下面的JS压缩包解压后将WebCalendar.js和validate.js放到web工程下的WebRoot下的JS目录下

 

导入日历JS文件

<script language="JavaScript" type="text/javascript" src="JS/WebCalendar.js"></script>

 

导入验证页面数据JS文件

<script language="JavaScript" type="text/javascript" src="JS/validate.js"></script>

 

在标签中添加点击事件调用弹出日历方法

<input type="text" id="age" name="resumedto.age" onclick="new Calendar().show(this);" require="true" dataType="" msg="" requiremsg="出生日期不能为空!">

 

在form表单上添加一个提交事件调用验证数据方法

<form name="listform" action="resume-doAdd" method="post" onsubmit="return Validator.Validate(this,3);">

<input type="text" id="linkPhone" name="resumedto.linkPhone" require="true" dataType="Mobile" msg="请输入正确的手机号!" requiremsg="移动电话不能为空!"/>

</form>

 

require指不能为空(true表示不允许为空),dataType指数据类型(Mobile表示是手机号码类型,在validate.js文件中有很多种数据类型,根据需要选择),msg指如果不满足数据类型时的提示信息,requiremsg指如果为空的提示信息。

 

 

在网页上显示当前时间的JS代码:

 

<script type="text/javascript">
 
var nowDate=new Date();
var month=nowDate.getMonth();
var day=nowDate.getDate();
var we=nowDate.getDay();
var hour=nowDate.getHours();
var min=nowDate.getMinutes();
var second=nowDate.getSeconds();
var week;
function autoTime(){
second++;
switch(we)
{
case 0: week="日";break;
case 1: week="一";break;
case 2: week="二";break;
case 3: week="三";break;
case 4: week="四";break;
case 5: week="五";break;
default: week="六";
}
if(second>59){min++;second=0}
if(min>59){hour++;min=0}
if(second<10){second="0"+second;}
document.getElementById("timer").innerHTML="现在是北京时间:2010年"+month+"月"+day+"日\t "+"星期"+week+"\t "+hour+":"+min+":"+second;

}
setInterval("autoTime()",1000);//setInterval 放在方法外面,不需要调用  setTimeout放在方法里面,需要调用 1秒执行一次方法
</script>

 

显示标签:

<font size="3" color="#0000BE"><span id="timer" ></span></font>

  • js.rar (6.9 KB)
  • 下载次数: 11
分享到:
评论

相关推荐

    javascript日历

    JavaScript日历是一款在网页中使用的交互式日历控件,它可以提供用户友好的日期选择功能,常见于在线表单、事件预订系统等场景。这款日历控件的独特之处在于它能够防止自身被页面上的其他元素遮挡,解决了JavaScript...

    网页表单中的日历控件

    网页表单是用户与网站交互的重要工具,它们允许用户输入数据、提交请求并接收服务器的响应。在网页表单中,日历控件是一个非常实用的功能,它为用户提供了一个直观的方式来选择日期,避免了手动输入可能产生的错误。...

    日历控件常用注册表单

    在这个注册表单中,JavaScript负责处理日历控件的逻辑,例如显示日历、处理用户的日期选择以及验证用户输入的有效性。常见的JavaScript日历库有jQuery UI的Datepicker、FullCalendar等,它们提供了丰富的选项和定制...

    Javascript特效代码大全 程序员常用的网页特效

    JavaScript可以对用户输入的数据进行实时验证,如邮箱格式、手机号码、密码强度等,减少服务器端的负担并提供即时反馈。 7. **图表绘制**: 使用JavaScript库如Chart.js或D3.js,可以创建各种数据可视化图表,如...

    几款漂亮的js 日历代码集合

    在JavaScript的世界里,日历控件是网页设计中不可或缺的一部分,尤其对于那些需要处理日期输入或者展示日期事件的应用。本文将深入探讨几款优秀的js日历代码,它们不仅功能强大,而且界面美观,能为你的网页增添专业...

    jQuery表单验证、弹出层、日历插件例子

    首先,表单验证是Web应用中不可或缺的一部分,确保用户输入的数据有效和符合要求。jQuery提供了方便的API,允许开发者通过添加自定义的验证规则来检查表单字段。例如,你可以验证电子邮件地址的格式、手机号码的有效...

    javascript日历.rar

    JavaScript日历控件是网页开发中常用的一种交互元素,它为用户提供了一个直观的方式来选择日期,常见于表单、事件预订或计划管理等场景。在这个"javascript日历.rar"压缩包中,你将找到三种不同风格的JavaScript日历...

    javascript日历控件

    在网页开发中,JavaScript日历控件常用于表单验证、事件安排、数据记录等场景。 创建JavaScript日历控件涉及到多个关键知识点: 1. **DOM操作**:JavaScript通过Document Object Model(DOM)与HTML页面进行交互。...

    javascript日历实例

    JavaScript日历实例是一种常见的网页交互元素,用于展示日期选择功能,常见于事件安排、预订系统或任何形式需要用户输入日期的表单中。在本实例中,我们主要关注JavaScript的使用来创建一个动态的日历功能,这在JSP...

    JavaScript实现日历组件-源代码

    因此,为了确保数据的准确性,开发者需要结合其他校验组件对用户输入的日期进行合法性检查,例如使用正则表达式进行格式验证,或者通过JavaScript编写自定义函数来检查日期的有效性。 在实际应用中,这样的日历组件...

    javascript常用代码大全.doc

    在提供的“JavaScript常用代码大全”中,我们可以看到许多实用的代码片段,涵盖了多个方面的功能,包括对话框、全屏窗口、XML处理、表单验证、字符检测、浏览器检测以及特定功能的实现。 1. 对话框: - `...

    常用表单填入日期使用日历控件JS

    这个组件能够帮助用户在填写表单时方便地选取日期,而不是手动输入,从而提高了数据输入的准确性和效率。 首先,我们需要了解JavaScript(JS)是网页开发中的脚本语言,它用于实现动态交互效果。在这个场景中,JS被...

    在表单中动态生成日历

    JSP(JavaServer Pages)和J2EE通常用于服务器端处理,例如验证日期输入、保存数据到数据库等。在表单提交时,JSP可以解析请求参数,进行必要的业务逻辑处理,如日期范围检查,然后返回响应。 ```jsp ...

    JavaScript 日历

    5. 与其他功能集成:JavaScript日历可以与表单、数据库、服务器端API等进行交互,例如提交选定的日期到服务器,或从服务器获取已保存的日期。 总结,JavaScript日历是一个典型的前端开发实例,它结合了JavaScript的...

    北大青鸟-S2-《JavaScript客户端验证和页面特效制作》(2-2)

    1. **表单验证**:JavaScript可以实时检查用户在表单中输入的数据,如邮箱格式、手机号码合法性、密码强度等,避免无效或错误的数据提交到服务器,提高用户体验。 2. **正则表达式**:在验证过程中,正则表达式是...

    JavaScript特效代码集

    6. **表单验证**:JavaScript可以验证用户在表单中输入的数据,提供实时反馈,防止无效或危险的数据提交到服务器。 7. **拖放功能**:通过监听鼠标事件和移动元素的位置,JavaScript可以实现拖放功能,常用于文件...

    PHP+JavaScript+HTML实现注册界面表单及日历控件1

    此外,为了增强用户体验,我们可以引入JavaScript日历控件,如My97DatePicker。这个控件可以让用户方便地选择日期,而不是手动输入。在HTML中引入对应的JavaScript文件,并在日期输入字段中应用它: ```html ...

    javascript 日历控件

    JavaScript日历控件是一种在网页上实现日期选择功能的交互元素,它允许用户通过图形界面方便地选取日期,常用于表单输入、事件预订或时间安排等场景。在这个主题中,我们将深入探讨JavaScript日历控件的设计原理、...

Global site tag (gtag.js) - Google Analytics