来源:https://www.cnblogs.com/xiaoxiao0314/p/7041731.html

1. 设置只能控件只能显示年月:search_date_monthreport为控件id,直接将以下代码复制到js中后替换id为你自己的id即可。

  1. $(function () {
  2. setDateToMonth('search_date_monthreport');
  3. });
  4. function setDateToMonth(id) {
  5. var db1=document.getElementById(id);
  6. var db = $(db1);
  7. db.datebox({
  8. onShowPanel: function () {//显示日趋选择对象后再触发弹出月份层的事件,初始化时没有生成月份层
  9. span.trigger('click'); //触发click事件弹出月份层
  10. //fix 1.3.x不选择日期点击其他地方隐藏在弹出日期框显示日期面板
  11. if (p.find('div.calendar-menu').is(':hidden')) p.find('div.calendar-menu').show();
  12. if (!tds) setTimeout(function () {//延时触发获取月份对象,因为上面的事件触发和对象生成有时间间隔
  13. tds = p.find('div.calendar-menu-month-inner td');
  14. tds.click(function (e) {
  15. e.stopPropagation(); //禁止冒泡执行easyui给月份绑定的事件
  16. var year = /\d{4}/.exec(span.html())[0];//得到年份
  17. var month = parseInt($(this).attr('abbr'), 10); //月份,这里不需要+1
  18. month = month < 10 ? '0' + month : month;
  19. db.datebox('hidePanel')//隐藏日期对象
  20. .datebox('setValue', year + '-' + month); //设置日期的值
  21. });
  22. }, 0);
  23. yearIpt.unbind();//解绑年份输入框中任何事件
  24. },
  25. parser: function (s) {
  26. if (!s) return new Date();
  27. var arr = s.split('-');
  28. return new Date(parseInt(arr[0], 10), parseInt(arr[1], 10) - 1, 1);
  29. },
  30. formatter: function (d) {
  31. return d.getFullYear() + '-' + (d.getMonth() + 1);/*getMonth返回的是0开始的,忘记了。。已修正*/
  32. }
  33. });
  34. var p = db.datebox('panel'), //日期选择对象
  35. tds = false, //日期选择对象中月份
  36. aToday = p.find('a.datebox-current'),
  37. yearIpt = p.find('input.calendar-menu-year'),//年份输入框
  38. //显示月份层的触发控件
  39. span = aToday.length ? p.find('div.calendar-title span') ://1.3.x版本
  40. p.find('span.calendar-text'); //1.4.x版本
  41. if (aToday.length) {//1.3.x版本,取消Today按钮的click事件,重新绑定新事件设置日期框为今天,防止弹出日期选择面板
  42.  
  43. aToday.unbind('click').click(function () {
  44. var now=new Date();
  45. now = now < 10 ? '0' + now : now;
  46. db.datebox('hidePanel').datebox('setValue', now.getFullYear() + '-' + (now.toString() + 1));
  47. });
  48. }
  49. };
  50.  
  51. //设置默认时间,默认为当月
  52. $(function (){
  53. setDateToDateBox();
  54. });

2. 附:字符串日期处理:

  1. //格式化日期
    function dateFormatHsbc(myDate) {
  2. // alert(myDate.getFullYear()+"-"+(myDate.getMonth()+1)+"-"+myDate.getDate());
  3. year = myDate.getFullYear();
  4. month = (myDate.getMonth()+1)>9?(myDate.getMonth()+1):("0"+(myDate.getMonth()+1));
  5. day = myDate.getDate()>9?myDate.getDate():("0"+myDate.getDate());
  6. var str = year+"-"+month+"-"+day;
  7. return str;
  8. }

  9.   //给easyui控件设置值为当月的第一天和最后一天
  10.   var date = $("#search_date_monthreport").datebox('getValue').replace(/-/g,"/");
  11.   var myDate = new Date(Date.parse(date));
  12.   year = myDate.getFullYear();
  13.   month = myDate.getMonth();
  14.   $("#search_sconsigedate").datebox('setValue',dateFormatHsbc(new Date(year,month,1)));
  15.   $("#search_econsigedate").datebox('setValue',dateFormatHsbc(new Date(year,(month+1),0)));

3.附:ajax同步加载,未得到后台结果之前页面显示loading...,使页面无法重复操作

  1. $.ajax({
  2. url:"${path}/path1/method1",
  3. type:'post',
  4. data:{'ckDate':ckDate1},
  5. //dataType:'json',
  6. beforeSend:function(XMLHttpRequest){
  7. $("#dg").datagrid("loading");
  8. },
  9. success:function(data1){
  10. if("success" == data1){
  11. $.messager.alert('My Title','操作成功!','info');
  12. $("#dg").datagrid('reload');
  13. }else{
  14. $.messager.alert('My Title','操作失败!','error');
  15. $("#dg").datagrid('reload');
  16. }
  17. },
  18. error:function(data1){
  19. $.messager.alert('My Title','操作失败!','error');
  20. $("#dg").datagrid('reload');
  21. }
  22. });

easyui-datebox设置只能选择年月,设置当前月的第一天和最后一天的更多相关文章

  1. easyui datebox 扩展 只显示年月

    http://blog.csdn.net/zhaobao110/article/details/47755445 一个日期控件只显示年月是很正常的事情.可是easyui datebox 不支持这种格式 ...

  2. Python 学习笔记:根据输入年月获取该月的第一天和最后一天

    目的: 给定一个时间,比如:2020.02,要求返回所输入月份的第一天及最后一天,比如:('2020.02.01', '2020.02.29') 参考博客:https://blog.csdn.net/ ...

  3. 转 EasyUi日期控件datebox设置,只显示年月,也只能选择年月

    1.引入Jquery和easyui,注低版本的Jquery和easy不能使用,这里使用的Jquery是1.8.2easyui是1.6.1.1.easyui下载地址:http://www.jeasyui ...

  4. easyui时间框只选择年月

    html: <input type="text" id="datetime" > js: <script type="text/ja ...

  5. Easyui控制combotree只能选择叶子节点

    $(function() { $('#tt').combotree({ url: 'getTree.do', onBeforeSelect: function(node) { if (!$(this) ...

  6. elementUI 日期时间选择器 只能选择当前及之后的时间

    日期时间选择器  只能选择当前及之后的时间 <el-date-picker class="input-border-null" prefix-icon="el-ic ...

  7. My97设置开始、结束 时间区间及输入框不能输入只能选择的方法

    时间区间开始: <input type="text" id = "first_time" name="first_time" valu ...

  8. easyui datebox 设置不可编辑

    easyui datebox不允许编辑可以输入 editable="false"<input class="easyui-datebox" editabl ...

  9. easyui datebox时间控件如何只显示年月

    easyui datebox控件,只显示年月,不显示年月日 需要的效果图如下: 具体的js代码: <script> $(function(){ intiMonthBox('costTime ...

随机推荐

  1. C++复习8.异常处理和RTTI

    C++异常处理和RTTI技术 20130930 1.异常处理的基本知识 C语言中是没有内置运行时错误处理机制,对于错误发生的时候使用的几种处理机制: 函数返回彼此协商后统一定义的状态编码来表示操作成功 ...

  2. 十一、dbms_random(随机数生成器)

    1.概述 提供了内置的随机数生成器,可以用于快速生成随机数. 2.包的组成 1).initialize作用:用于初始化dbms_random包,必须提供随机数种子.语法:dbms_random.ini ...

  3. 基于IDEA和Maven的SSM分层项目搭建

    前言 虽然现在SpringBoot开始流行,但是SSM作为一个经典框架,还是有必要去了解一下. 项目建立 1.新建一个空白的Maven项目,如下图.然后把IDEA自动生成的多余src目录删掉. 2.右 ...

  4. L167

  5. Javascript MV framework 对比

    Javascript 最近的framework笔记多,大致可分以下3类.单向绑定简单直接.ajax从service拿数据传递给viewtemplate进行绑定.当然这个过程也可以在服务器端来做,.ne ...

  6. JMter参数化

    参数化是干嘛的呢,咱们在调用接口的时候,有入参,那参数里面的值如果经常变化的话,就得每次去改了,很麻烦,这时候咱们就把需要经常变的值,改成可以变化的或者是咱们提前设置好的一些值,这样的话,调用的时候就 ...

  7. java入门学习(6)—封装,继承,多态,this,super,初始代码块

    1.[封装]:将对象的状态信息隐藏,不允许直接访问,而是通过该类提供的的方法阿里实现内部信息的访问和操作. 使用到的修饰符:private,不用修饰符(default),protected,publi ...

  8. Objective C - 3 - 实现一个计算器

    代码 // // CalculatorViewController.m // Calculator // // Created by sskset on 5/28/14. // Copyright ( ...

  9. linux vim 命令使用

    基本上vim可以分为三种状态,分别是命令模式(command mode).插入模式(Insert mode)和底行模式(last line mode) 模式切换方法 在命令模式输入“i”,进入插入模式 ...

  10. ThreadDeath 理解

    public class RunnableTest2 { public static Object obj1 = new Object(); public static Object obj2 = n ...