默认日期为3/23/2011 改为2010-03-23等
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>jQuery EasyUI</title>
<link rel="stylesheet" type="text/css" href="../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../themes/icon.css">
<script type="text/javascript" src="../jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="../jquery.easyui.min.js"></script>
<script>
$('#dd').datebox({
closeText:'关闭',
formatter:function(date){
var y = date.getFullYear();
var m = date.getMonth()+1;
var d = date.getDate();
var h = date.getHours();
var M = date.getMinutes();
var s = date.getSeconds();
function formatNumber(value){
return (value < 10 ? '0' : '') + value;
}
alert(formatNumber(h));
return y+'-'+m+'-'+d+' '+ formatNumber(h)+':'+formatNumber(M)+':'+formatNumber(s);
},
parser:function(s){
var t = Date.parse(s);
if (!isNaN(t)){
return new Date(t);
} else {
return new Date();
}
}
});
</script>
</head>
<body>
<h1>DateBox</h1>
<div style="margin-bottom:10px;">
<a href="#" onclick="disable()">disable</a>
<a href="#" onclick="enable()">enable</a>
</div>
<input id="dd" class="easyui-datetimebox" value="3/23/2010 23:10:10" required="true"></input>
</body>
</html>
datebox有以下属性
currentText 看名字就知道意思了即当前按钮显示的文本内容 默认为today
closeText 关闭按钮显示的文本内容 默认是close
disabled 插件是否有用
formatter 即文本框中日期显示的格式,改属性是一个函数,解释一个date的参数
parser 看名知意解析日期字符串成日期类型
Name
Type
Description
Default
currentText |
string |
The text to display for the current day button. |
Today |
closeText |
string |
The text to display for the close button. |
Close |
disabled |
boolean |
When true to disable the field. |
false |
formatter |
function |
A function to format the date, the function take a 'date' parameter and return a string value. |
|
parser |
function |
A function to parse a date string, the function take a 'date' string and return a date value. |
分享到:
相关推荐
1. **组件使用**:了解如面板(panel)、表格(datagrid)、下拉框(combobox)、日期选择器(datebox)等主要组件的基本用法,以及它们的配置选项。 2. **数据绑定**:学会如何将后台数据与 EasyUI 组件结合,例如...
jQuery EasyUI 提供了一系列表单组件,如复选框(checkbox)、单选按钮(radio)、日期选择器(datebox)等,方便创建和验证表单。 ### 3. 主题系统 jQuery EasyUI 支持多主题,开发者可以通过修改或自定义 CSS ...
8. `plugins`目录:这里可能包含jQuery EasyUI的扩展插件,如日期选择器(datebox)、时间选择器(timespinner)等。 9. `locale`目录:包含不同语言的本地化文件,使得jQuery EasyUI可以支持多语言环境。 10. `...
EasyUI 是一个基于 jQuery 的轻量级前端框架,它提供了一系列的组件,如 Dialog、Grid 和 Datebox,用于构建富客户端界面。Datebox 是 EasyUI 中用于输入日期的控件,它提供了日历面板供用户选择日期。 首先,我们...
- jQuery EasyUI 提供了多种预设主题,如 "default"、"gray" 等,可以通过更改 CSS 文件轻松改变整个应用的外观风格。 3. **数据绑定与异步通信**: - 使用 `datagrid` 或 `combobox` 等组件时,可以方便地与后台...
5. 插件和扩展:除了内置组件,社区还开发了许多插件,如日期选择器(datebox)、时间选择器(timespinner)、树网格(treegrid)等,这些扩展增强了EasyUI的功能。学习如何引入和使用这些插件能提升应用的用户体验...
- **日期选择器**: `<input class="easyui-datebox" ... />` #### 4. **布局与容器** - **面板**: `<div class="easyui-panel" ... >` - 可嵌套其他 UI 组件,支持拖拽和折叠等功能。 - **选项卡**: `...
1. **组件的使用**:Demo中包含了各种组件的实例,如对话框(dialog)、数据网格(datagrid)、下拉列表(combobox)、日期选择器(datebox)等。通过这些例子,你可以了解如何引入并初始化组件,以及如何配置它们的...
3. **与jQuery插件的协同**:了解如何在jQuery EasyUI基础上扩展或集成其他jQuery插件,丰富功能。 通过深入学习和实践这些知识点,你将能够熟练地使用jQuery EasyUI构建功能丰富的Web应用程序,实现类似ExtJS的...
- **其他组件**:包括布局(Layout)、树形控件(Tree)、下拉选择框(ComboBox)、日期选择器(DateBox)等,丰富了Web应用的交互体验。 5. **数据绑定与Ajax** - **Json数据**:EasyUI与JSON格式的数据源配合良好,通过...
6. **插件扩展**:EasyUI社区提供了许多第三方插件,如日期选择器(datebox)、树形菜单(treegrid)等,这些插件进一步丰富了框架的功能。 7. **兼容性和性能优化**:EasyUI兼容大部分现代浏览器,包括Chrome、...
14. **插件扩展**:EasyUI允许开发者根据需求自定义组件和功能,通过编写jQuery插件实现。 15. **主题系统**:提供多种预设主题,可以通过CSS文件轻松更改页面风格。 这个API中文版详细解释了每个组件的使用方法、...
DateBox 是一个用于输入和选择日期的组件,它结合了文本框和日历插件的功能,使得用户能够方便地输入或选择日期。 **实例** ```html <input id="d1" class="easyui-datebox" data-options="formatter:...
jQuery EasyUI 是一个基于 jQuery 的前端框架,它提供了一系列的插件和组件,使得开发者可以快速构建具有专业界面和交互的Web应用。这个压缩包包含了一些关键文件和一个名为 "demo" 的目录,用于展示jQuery EasyUI的...
6. **插件扩展**:除了内置组件外,jQuery EasyUI 社区还提供了许多第三方插件,如日期选择器(`datebox`)、时间选择器(`timespinner`)等,这些插件进一步丰富了功能库。 7. **API理解**:Richie696 制作的中文...
5. **插件扩展**:除了内置组件,EasyUI 社区还提供了许多第三方插件,如日期选择器(datebox)、时间选择器(timespinner)等,进一步丰富了功能。 6. **主题系统**:EasyUI 支持多主题切换,用户可以轻松地更改...
- **日期选择器(DateBox)**:提供日期选择功能,有多种模式,如日期、日期时间等。 - **下拉选择框(ComboBox)**:组合框,包含下拉列表,可用于搜索和选择。 - **进度条(ProgressBar)**:展示任务进度,增强用户...
在jQuery EasyUI 1.3.4的API中,我们可以找到如对话框(dialog)、表格(datagrid)、下拉菜单(combobox)、日期选择器(datebox)等常见UI组件。这些组件都有丰富的配置选项和API接口,可以进行高度定制,满足不同...
在`plugins`目录下,存放着EasyUI的各种可扩展插件,如日期选择器(datebox)、时间选择器(timespinner)等,这些插件极大地丰富了EasyUI的功能,让开发者可以构建更加灵活多样的用户界面。 `locale`目录则包含...