EasyUI日期选择框
时间:2022-04-22
本文章向大家介绍EasyUI日期选择框,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="js/easyui.css">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.easyui.min.js"></script>
</head>
<body>
开始日期:<input class="easyui-datebox" name="begindate" id="begindate"
data-options="formatter:myformatter,parser:myparser"></input>
结束日期:<input class="easyui-datebox" name="enddate" id="enddate"
data-options="formatter:myformatter,parser:myparser"></input>
<script type="text/javascript">
function myformatter(date) {
var y = date.getFullYear();
var m = date.getMonth() + 1;
var d = date.getDate();
return y + '-' + (m < 10 ? ('0' + m) : m) + '-'
+ (d < 10 ? ('0' + d) : d);
}
function myparser(s) {
if (!s)
return new Date();
var ss = (s.split('-'));
var y = parseInt(ss[0], 10);
var m = parseInt(ss[1], 10);
var d = parseInt(ss[2], 10);
if (!isNaN(y) && !isNaN(m) && !isNaN(d)) {
return new Date(y, m - 1, d);
} else {
return new Date();
}
}
</script>
</body>
</html>
先在html的head部分引入需要的EasyUI样式包和js包
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="js/easyui.css">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.easyui.min.js"></script>
</head>
插入input元素,默认input日期格式是2/6/2014,必须加入以下js处理后的日期格式才是通用2014-02-14这种格式。
html body内容如下:
开始日期:
<input class="easyui-datebox" name="begindate"
id="begindate" data-options="formatter:myformatter,parser:myparser"></input>
结束日期:
<input class="easyui-datebox" name="enddate"
id="enddate" data-options="formatter:myformatter,parser:myparser"></input>
<script type="text/javascript">
function myformatter(date) {
var y = date.getFullYear();
var m = date.getMonth() + 1;
var d = date.getDate();
return y + '-' + (m < 10 ? ('0' + m) : m) + '-'
+ (d < 10 ? ('0' + d) : d);
}
function myparser(s) {
if (!s)
return new Date();
var ss = (s.split('-'));
var y = parseInt(ss[0], 10);
var m = parseInt(ss[1], 10);
var d = parseInt(ss[2], 10);
if (!isNaN(y) && !isNaN(m) && !isNaN(d)) {
return new Date(y, m - 1, d);
} else {
return new Date();
}
}
</script>js获取和设置EasyUI日期格式框的日期如下:
获取日期值:
function getDate(){
var begindate=$('#begindate').datebox('getValue'); //注意.datebox('getValue')是EasyUI固定的写法。
}
设置日期值:
function setDate(){
$("#begindate").datebox('setValue','<%=begindate%>');
$("#enddate").datebox('setValue','<%=enddate%>');
}
//setValue是EasyUI固定的写法。
- Android中应用调用系统权限
- Android5.0以后隐式启动ServiceBug
- Android6.0源码分析之录音功能(一)
- Android6.0源码开发之修改默认音量default及max和min
- Android源码开发之添加/删除系统应用
- 按键事件处理
- Android6.0锁屏源码分析之界面布局分析
- Android6.0源码分析之menu键弹出popupwindow菜单流程分析
- Android中初步自定义view
- Android中View研究自学之路 Android6.0源码分析之View(一)Android6.0源码分析之View(二)
- Android蓝牙配对弹出框过程分析 Android蓝牙配对弹出框过程分析
- Android6.0之修改或者查看系统属性值
- linux下Android7.0多用户编译问题
- 带你解锁蓝牙skill(0)
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- MTO变量缩放与统一决策空间
- css相关的几个点
- .Net Core微服务入门全纪录(四)——Ocelot-API网关(上)
- Apache下如何禁止指定目录运行PHP脚本
- .Net Core微服务入门全纪录(五)——Ocelot-API网关(下)
- 在Docker中运行PostgreSQL + pgAdmin 4
- .Net Core微服务入门全纪录(六)——EventBus-事件总线
- SVN提交时强制用户写日志
- Apache vhost配置
- win10使用WSL 2运行Docker Desktop,运行文件从C盘迁移到其他目录
- htaccess简介和16个小技巧
- Nginx禁止指定目录运行PHP脚本
- 机器学习数学笔记|偏度与峰度及其 python 实现
- ABP(ASP.NET Boilerplate Project)快速入门
- IdentityServer4 4.x版本 配置Scope的正确姿势