jQuery EasyUI中的日期控件DateBox修改方法


Posted in Javascript onNovember 09, 2016

jQuery EasyUI中的日期控件DateBox很好用的,首先需要引入jquery文件,代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"> <title>Basic DateBox - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="css/easyui.css">
<script type="text/javascript" src="js/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="js/jquery.easyui.min.js"></script>
</head>
<body>
<div> <input class="easyui-datebox"></input> </div>
</body>
</html>

效果为:

jQuery EasyUI中的日期控件DateBox修改方法 

这里是英文的,如果有要求用中文的,那么需要的改的几个地方,首先是月份的,找到下面的代码:

$.fn.calendar.parseOptions=function(_454){
var t=$(_454);
return $.extend({},$.parser.parseOptions(_454,["width","height",{firstDay:"number",fit:"boolean",border:"boolean"}]));
};
$.fn.calendar.defaults={width:180,height:180,fit:false,border:true,firstDay:0,weeks:["S","M","T","W","T","F","S"],months:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],year:new Date().getFullYear(),month:new Date().getMonth()+1,current:new Date(),onSelect:function(date){
}};
})(jQuery);

改成下面的对应的

$.fn.calendar.parseOptions=function(_454){
var t=$(_454);
return $.extend({},$.parser.parseOptions(_454,["width","height",{firstDay:"number",fit:"boolean",border:"boolean"}]));
};
$.fn.calendar.defaults={width:180,height:180,fit:false,border:true,firstDay:0,weeks:["一", "二", "三", "四", "五", "六", "日"], months:["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"], year:new Date().getFullYear(),month:new Date().getMonth()+1,current:new Date(),onSelect:function(date){
}};
})(jQuery);

这样就行了,还有一个时间格式的修改,默认的是5/27/2013,即月/日/年的格式,如果换成的2013-05-27这样的,官方也给出了代码,如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Basic DateBox - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="css/easyui.css">
<script type="text/javascript" src="js/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="js/jquery.easyui.min.js"></script>
</head>
<body>
<div class="date">
<input class="easyui-datebox" data-options="formatter:myformatter,parser:myparser"></input>
</div>
</body>
<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>
</html>

这样的话,格式怎么变的话,都很好修改的!

以上这篇jQuery EasyUI中的日期控件DateBox修改方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
增强用户体验友好性之jquery easyui window 窗口关闭时的提示
Jun 22 Javascript
YUI模块开发原理详解
Nov 18 Javascript
jquery创建表格(自动增加表格)代码分享
Dec 25 Javascript
js的hasownproperty使用示例
Mar 02 Javascript
常用的jQuery前端技巧收集
Dec 24 Javascript
jQuery中insertBefore()方法用法实例
Jan 08 Javascript
react-router实现按需加载
May 09 Javascript
JS设置手机验证码60s等待实现代码
Jun 14 Javascript
JavaScript中重名的函数与对象示例详析
Sep 28 Javascript
vue.js 双层嵌套for遍历的方法详解, 类似php foreach()
Sep 07 Javascript
解决vue keep-alive 数据更新的问题
Sep 21 Javascript
vue 判断两个时间插件结束时间必选大于开始时间的代码
Nov 04 Javascript
jQuery实现导航高亮的方法【附demo源码下载】
Nov 09 #Javascript
JavaScript动态检验密码强度的实现方法
Nov 09 #Javascript
jquery获取easyui日期控件的值实现方法
Nov 09 #Javascript
给easyui的datebox控件添加清空按钮的实现方法
Nov 09 #Javascript
给easyui datebox扩展一个清空的实例
Nov 09 #Javascript
JS刷新父窗口的几种方式小结(推荐)
Nov 09 #Javascript
js 能实现监听F5页面刷新子iframe 而父页面不刷新的方法
Nov 09 #Javascript
You might like
php文章内容分页并生成相应的htm静态页面代码
2010/06/07 PHP
php冒泡排序、快速排序、快速查找、二维数组去重实例分享
2014/04/24 PHP
PHP获取指定日期是星期几的实现方法
2016/11/30 PHP
不常用但很实用的PHP预定义变量分析
2019/06/25 PHP
js限制文本框为整数和货币的函数代码
2010/10/13 Javascript
setTimeout和setInterval的区别你真的了解吗?
2011/03/31 Javascript
js判断运行jsp页面的浏览器类型以及版本示例
2013/10/30 Javascript
javascript陷阱 一不小心你就中招了(字符运算)
2013/11/10 Javascript
Node.js中的事件驱动编程详解
2014/08/16 Javascript
js添加select下默认的option的value和text的方法
2014/10/19 Javascript
JS DOMReady事件的六种实现方法总结
2016/11/23 Javascript
.vue文件 加scoped 样式不起作用的解决方法
2018/05/28 Javascript
JavaScript事件对象event用法分析
2018/07/27 Javascript
在iFrame子页面里实现模态框的方法
2018/08/17 Javascript
[37:02]OG vs INfamous 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/17 DOTA
python-itchat 获取微信群用户信息的实例
2019/02/21 Python
Python使用reportlab模块生成PDF格式的文档
2019/03/11 Python
python实现批量视频分帧、保存视频帧
2019/05/31 Python
python解析命令行参数的三种方法详解
2019/11/29 Python
python输出pdf文档的实例
2020/02/13 Python
python 实现在无序数组中找到中位数方法
2020/03/03 Python
python列表删除和多重循环退出原理详解
2020/03/26 Python
Python 如何展开嵌套的序列
2020/08/01 Python
Html5 Geolocation获取地理位置信息实例
2016/12/09 HTML / CSS
京东奢侈品:全球奢侈品牌
2018/03/17 全球购物
广告学专业推荐信范文
2013/11/23 职场文书
2014年乡镇植树节活动方案
2014/02/28 职场文书
质量承诺书范文
2014/03/27 职场文书
优质服务口号
2014/06/11 职场文书
学生会干部自我鉴定2014
2014/09/18 职场文书
中学生检讨书1000字
2014/10/28 职场文书
初中差生评语
2014/12/29 职场文书
销售员岗位职责范本
2015/04/11 职场文书
2015秋季田径运动会广播稿
2015/08/19 职场文书
python随机打印成绩排名表
2021/06/23 Python
Win11怎么修改电源模式?Win11修改电源模式的方法
2022/04/05 数码科技