`
tangzlboy
  • 浏览: 90065 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

时间控件的设计

 
阅读更多
第一步:页面设计
<script type="text/javascript" src="<%=request.getContextPath()%>/js/Calendar.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/js/getDate.js"></script>
<td class="tdtitle"><font color="#ec0000">*</font>发生时间:</td>
<td>
<s:textfield id="occurrenceDate" name="occurrenceDate" size="10" onfocus="c.show(this);"
readonly="true" onkeydown="if(event.keyCode == 13){onEnter()}" onblur="checkOccurrenceTime()"/>
<img src="<%=request.getContextPath()%>/images/eraser.gif" onclick="delC(0);"/>
</td>

第二步:输入的时间检查
function onEnter(){
checkOccurrenceTime();
}

第三步: 输入的时间检查(失去焦点)
function checkOccurrenceTime(){
// 取得发生日期
var occurrenceDate = document.getElementById("occurrenceDate").value;
// 取得发生时间(将字符串的空格去除)
var occurrenceTime = trim(document.getElementById("occurrenceTime").value);
// 返回结果值
var returnValue = "";
// 判断日期是否输入
if(occurrenceDate != ""){
// 判断发生时间是否为空
if(occurrenceTime != ""){
// 将字符串中的全角字符转换成半角字符
occurrenceTime = DBC2SBC(occurrenceTime);
// 检查时间格式是否正确
returnValue = formatDateTime(occurrenceTime);
if(returnValue == "false"){
alert("您输入的发生时间格式不正确!");
document.getElementById("occurrenceTime").focus();
return;
}else{
document.getElementById("occurrenceTime").value = returnValue;
}
}else{
// 设定默认时间
document.getElementById("occurrenceTime").value = "00:00:00";
}
}
}
1
1
分享到:
评论
1 楼 cuisuqiang 2012-03-02  
标题很新颖,可是没看懂说的什么

相关推荐

    携程网 时间控件 jquery控件 时间控件 php

    这个时间控件设计得并不花哨,但非常实用,适合开发者根据具体需求进行定制和调整。在实际应用中,可能会涉及到以下技术点: 1. **jQuery插件开发**:这个时间控件可能是基于jQuery的一个自定义插件,允许开发者...

    WPF日期时间控件-DateTimePicker

    在Windows Presentation ...无论是初学者还是经验丰富的开发者,都能从中获取到关于日期时间控件设计和实现的宝贵知识。通过深入研究源代码和相关文档,我们可以更好地理解和掌握WPF框架下的UI设计和编程技巧。

    一个时间控件的例子和使用方法

    五、时间控件设计原则 1. 用户友好:易于理解和操作,减少用户输入错误。 2. 可访问性:考虑视力障碍或其他残疾用户的使用需求。 3. 灵活性:提供多种输入方式,满足不同用户习惯。 4. 清晰反馈:选择后应有明确的...

    PB时间控件PB各种时间控件, PB各种时间控件, PB各种时间控件 PB各种时间控件

    在PB中,时间控件是开发用户界面时不可或缺的一部分,它们允许用户输入、选择或操作日期和时间值。本篇文章将深入探讨PB中的各种时间控件及其应用场景。 1. **日期选择器控件 (Date Picker)**:PB提供了内置的日期...

    WPF 时间控件重写

    使用XAML语言,我们可以为时间控件设计一个直观的界面。这可能包括一个文本框(TextBox)用于显示时间,以及两个按钮(增加和减少)用于手动设置时间。同时,可以添加一个下拉框(ComboBox)或者日历控件(Calendar...

    jquery更换皮肤时间控件

    Tangram的时间控件设计简洁,易于使用,并且同样支持皮肤更换。与jQuery UI不同,Tangram的皮肤更换可能需要直接修改或替换其内部的CSS样式,或者利用其提供的主题配置接口。这可能需要对CSS和JavaScript有一定的...

    javase时间控件

    总之,“javase时间控件”是一个用Java SE实现的日期选择组件,它借鉴了JavaScript的时间控件设计,提供了一种在Java桌面应用中选择日期的方法。通过分析源代码和使用提供的可执行文件,我们可以深入了解其工作原理...

    JS日期/时间控件(简单易用)

    2. **日期/时间控件设计** - **用户界面**:一个良好的日期/时间控件应具有直观的UI,如日历视图、时间滑块等,方便用户选择。 - **响应式设计**:控件需要适应不同设备的屏幕大小,确保在手机、平板和桌面电脑上...

    js 时间控件 js 时间控件

    在本文中,我们将深入探讨JavaScript时间控件的设计原理、常见实现方式以及相关API。 一、设计原理 JavaScript时间控件的基本思想是通过创建可交互的UI元素,如下拉框、滑块或者日历视图,来帮助用户选择日期和...

    时间控件!

    10. **用户体验**:良好的时间控件设计应直观易用,减少用户的认知负担。这可能意味着提供清晰的指示,合理的时间步进(如15分钟间隔),以及允许快速撤销和重做的功能。 综上所述,时间控件在IT行业中扮演着重要...

    界面非常美观的时间控件

    1. **交互设计**:优秀的交互设计使用户能够直观地理解如何操作时间控件。例如,滑动选择、点击调整、拖拽设定等都是常见的交互方式。"界面非常美观的时间控件"很可能提供了这些友好且直观的交互机制。 2. **视觉...

    c#显示时间控件

    在C#编程中,时间控件是用于展示和操作时间的一种可视化元素,它通常被集成在Windows Forms或WPF应用程序中。"c#显示时间控件"主要涉及到两种常见的控件:DateTimePicker和Timer。 DateTimePicker控件允许用户选择...

    ext4 年月时间控件 年月日时间控件 年月日时分秒时间控件

    总的来说,EXTJS4的时间控件是构建动态、交互性强的Web应用的重要工具,它提供的不同层次的时间选择功能满足了各种需求,同时其高度的可定制性和灵活性也使得开发者能根据项目需求进行个性化设计。通过深入理解和...

    my97时间控件

    5. **易用性**:my97时间控件的设计考虑了用户体验,其操作简单直观,用户可以通过鼠标点击或键盘快捷键轻松进行日期和时间的选择。 6. **兼容性**:这款控件通常适用于多种浏览器环境,包括Internet Explorer、...

    在PB中使用日期时间控件

    在PowerBuilder(PB)开发环境中,日期时间控件是一种常用的功能元素,用于用户界面中输入或选择日期和时间。在PB中,日期时间控件提供了直观的用户交互,使得应用程序可以方便地处理与日期和时间相关的数据。下面将...

    JS时间控件 script时间控件 漂亮的 日历

    JavaScript(简称JS)时间控件是网页开发中常用的一种组件,用于帮助用户在网页上方便地选择或输入日期和时间。这些控件通常通过JavaScript库或者自定义脚本实现,可以提供美观的交互界面和灵活的格式化选项。在本...

    日期选择时间控件 很强悍的

    在IT领域,尤其是在网页开发和用户界面设计中,日期选择时间控件是不可或缺的一部分。这样的控件允许用户方便地选择日期和时间,提高了交互性和用户体验。"日期选择时间控件"是一个强大的工具,通常用于在线表单、...

    js 时间控件

    描述中提到,这个时间控件设计得简单易用且稳定,配置过程相当简便。只需要引入一段脚本代码和一个文本框,就能实现在网页上显示并操作时间的选择功能。这表明该控件可能已经封装好了所有必要的功能,开发者只需进行...

    时间控件,web前端

    当前的Web应用普遍要求响应式设计,时间控件也不例外。在不同设备和屏幕尺寸上,时间控件应能自动调整布局,以适应触摸操作或鼠标操作。 6. **无障碍性(Accessibility)** 遵循WCAG(Web Content Accessibility ...

    非常好用的精确到时分的js时间控件

    这个组件被称为“非常好用的精确到时分的js时间控件”,并且在原有的基础上进行了改进,优化了用户体验。 首先,我们要理解JavaScript时间控件的基本原理。在JavaScript中,我们可以使用内置的`Date`对象来处理日期...

Global site tag (gtag.js) - Google Analytics