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 相关文章推荐
window.open被浏览器拦截后的自定义提示效果代码
Nov 19 Javascript
Extjs ajax同步请求时post方式参数发送方式
Aug 05 Javascript
javascript 带有滚动条的表格,标题固定,带排序功能.
Nov 13 Javascript
JQuery中如何传递参数如click(),change()等具体实现
Apr 28 Javascript
jQuery javascript获得网页的高度与宽度的实现代码
Apr 26 Javascript
再谈javascript注入 黑客必备!
Sep 14 Javascript
JS无缝滚动效果实现方法分析
Dec 21 Javascript
vue axios 表单提交上传图片的实例
Mar 16 Javascript
react配合antd组件实现的管理系统示例代码
Apr 24 Javascript
angular2组件中定时刷新并清除定时器的实例讲解
Aug 31 Javascript
elementUI多选框反选的实现代码
Apr 03 Javascript
JS数组的常用方法整理
Mar 31 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实现读取一个1G的文件大小
2013/08/24 PHP
PHPer 需要了解的 5 个 Composer 小技巧
2014/08/18 PHP
php去除html标记的原生函数详解
2015/01/27 PHP
php抽象方法和抽象类实例分析
2016/12/07 PHP
php使用preg_match()函数验证ip地址的方法
2017/01/07 PHP
PHP实现合并两个排序链表的方法
2018/01/19 PHP
打开超链需要“确认”对话框的方法
2007/03/08 Javascript
用倒置滤镜把div倒置,再把table倒置。
2007/07/31 Javascript
图片连续滚动代码[兼容IE/firefox]
2009/06/11 Javascript
url 特殊字符 传递参数解决方法
2010/01/01 Javascript
jquery 图片Silhouette Fadeins渐显效果
2010/02/07 Javascript
js模拟滚动条(横向竖向)
2013/02/22 Javascript
js(jQuery)获取时间的方法及常用时间类搜集
2013/10/23 Javascript
jQuery实现购物车数字加减效果
2015/03/14 Javascript
Js制作点击输入框时默认文字消失的效果
2015/09/05 Javascript
超实用的JavaScript代码段 附使用方法
2016/05/22 Javascript
简单了解JavaScript操作XPath的一些基本方法
2016/06/03 Javascript
jquery遍历标签中自定义的属性方法
2016/09/17 Javascript
jQuery实现动态文字搜索功能
2017/01/05 Javascript
使用原生的javascript来实现轮播图
2017/02/24 Javascript
vue组件父与子通信详解(一)
2017/11/07 Javascript
js监听html页面的上下滚动事件方法
2018/09/11 Javascript
python实现定时播放mp3
2015/03/29 Python
python爬取酷狗音乐排行榜
2019/02/20 Python
python实现顺时针打印矩阵
2019/03/02 Python
Python将二维列表list的数据输出(TXT,Excel)
2020/04/23 Python
使用darknet框架的imagenet数据分类预训练操作
2020/07/07 Python
python中四舍五入的正确打开方式
2021/01/18 Python
如何估计一张表的大小(假设该表中有1万条数据)
2016/03/27 面试题
制药工程专业毕业生推荐信
2013/12/24 职场文书
《大海那边》教学反思
2014/04/09 职场文书
法制教育演讲稿
2014/09/10 职场文书
本科毕业论文指导教师评语
2014/12/30 职场文书
高中生个性发展自我评价
2015/03/09 职场文书
物资采购管理制度
2015/08/06 职场文书
golang interface判断为空nil的实现代码
2021/04/24 Golang