日历选择控件
DOJO学习笔记(10)--日期控件DropdownDatePicker和DatePicker
DOJO 学习笔记(七)-日期控件 DropdownDatePicker
和 DatePicker
这是两个封装良好的日历组件,用来给用户提供方便的日历选择方式。 以较为复杂的 DropdownDatePicker 为例,首先在页面中 require 进来这个组件: <script type="text/javascript"> <!-dojo.require("dojo.widget.DropdownDatePicker"); //--> </script> 然后在页面中加入: <div inputName="startDate" dojoType="dropdowndatepicker" dateFormat="%Y-%m-%d" weekStartsOn="1" adjustWeeks="true"/> 或 <div inputName="endDate" dojoType="dropdowndatepicker" dateFormat="%Y-%m-%d" weekStartsOn="1" adjustWeeks="true"/> Dojo 就会自动生成两个日历组件,一个用来选择开始日期,一个用来选择结束 日期。 其 中的属性 dojoType 指明 widget 的类型(全部小写就可以了)。inputName 就是生成的 input 字段的 name,提交时候作为表单的一个 参数。dateFormat 是日期的格式。weekStartsOn 是日历中显示的一周以哪一天开始,这里是以周 一开始(0-6,0 代表周日)。 adjustWeeks 指明是否需要根据每个月的实际天 数来调整日历中每月显示的天数(如果不调整,每个月除了自己的天数,还会多 出一些相邻月份的天数, 总的天数固定为 42 天)。 如果需要给日期设置一个初始值,可以添加 value 属性,例如 value="2006-10-25"。 以下的例子将组件的 setDate 事件(就是组件的 setDate 方法被调用)与外部某 个回调函数关联起来: html 这样声明: <div id="foo" inputName="startDate" dojoType="dropdowndatepicker" dateFormat="%Y-%m-%d" weekStartsOn="1" adjustWeeks="true"/> Javas cript 这样写: <script type="text/javas cript"> <!-function test(rfcDate){
excel日历控件
excel日历控件
excel日历控件[excel日历控件的调出方法步骤]
1、添加整个月份的日历
关上一个excel表格,页面表格左上角“扳手和锤子”这个其它控件的按钮。
在弹出的对话框中,找到底部的日历控件,点击确定按钮。
握住鼠标左键在表格上面拖曳,构成一个黑色的矩形,抬起鼠标。
插入日历插件成功。
拖动可移动日历的位置和大小。
2、嵌入单个日期的日历控件
如何添加单个的日历控件,第一步的方法和上面的一样。
点击表格左上角“扳手和锤子”这个其它控件的按钮。
在冲破的对话框中找出microsoftdateandtimepickercontrol6.0的控件,挑选该控件,页面确认按钮。
按住鼠标左键在表格上面拖动,行程一个黑色的矩形,松开鼠标。
填入单个日历插件顺利。
拖曳可移动日历的边线和大小。
有些人会说我的excel怎么找不到“其它控件”的按钮。
其实呢,它需要我们自己添加才能被显示出来。
我们看下怎么添加。
找出文档左上角office按钮,右击,挑选“自定义快速访问工具栏”。
在跳出的excel选项中依次选择自定义--不在功能区中的命令--其它控件--添加--确定。
我们就可以在表格左上角插入其它控件的按钮。
猜猜你讨厌:
1.excel加入日期控件的教程
2.excel中版展开调用日历控件的操作方式技巧
3.excel中如何添加日历控件
4.excel单元格中怎样填入日历模板
5.excel加日历控件的方法
6.excel怎样通过日历控件嵌入日历。
选择日期Excel日历控件将日期插入到指定单元格教学文稿
选择日期Ex c e l日历控件将日期插入到指定单元格选择日期Excel日历控件将日期插入到指定单元格在Excel中如何实现选择日历控件,就将日期插入到指定的单元格?请跟随如下操作;在EXCEL窗口中执行“视图工具栏控件工具箱”;弹出如下图对话框;ci塞s150个控件WeTiTrijLLndei- ser llelp erWebThukder DapPlayer 1W etV i e wF D! d er_I c on1WIA Vi de(\Pre^i ew CI SES Wi U^oj Pl AyerXD o^nl osddf 1 inager 匚lase UDRHXWF Class ixrn迂移按上图的操作,找到日历控件11.0”,之后在EXCEL窗口中使用鼠标左键一拖,拖出如下图的控件;个日期之后,日期自动插入到单元格;除C列之外,点击其他列的单元格,不会弹出日历选择控件;要想实现这样的效果,得使用VBA来实现;选择日历控件,鼠标左键双击,进入代码编辑模式;如下图!上图中,第一个过程代码就是日历控件所需要的代码,另外,还得需要另外一个代码,在图中按红线圈住部分选择,找到对应的过程,输入如下的VBA代码即可!完成之后,直接运行VBA代码,返回EXCEL操作窗口,即可实现效果了!如上图,C3单元格已插入了日期,当你选择C列其他单元格时,就弹出日历控件,以供选择,选择完成,即可插入日期了!为方便操作,提供源代码:Private Sub Cale ndar1 Click()ActiveCell = Cale ndar1.ValueMe.Cale ndar1.Visible = FalseEnd SubPrivate Sub Worksheet_Selectio nCha nge(ByVal Target As Ra nge)If Target.Colu mn = 1 The nMe.Cale ndar1.Visible = TrueElseMe.Cale ndar1.Visible = FalseEnd IfEnd SubB新建文本文档.txt。
excel2010添加日期选择器的教程
excel2010添加日期选择器的教程
在Excel中经常需要用到日期选择器的控件,或许有的朋友并不知道日期选择器该如何添加,如果不懂的朋友欢迎一起来学习讨论一番。
下面是店铺带来的关于excel2010添加日期选择器的教程,希望阅读过后对你有所启发!
excel2010添加日期选择器的教程:
添加日期选择器步骤1:在某一单元格中插入日历控件
添加日期选择器步骤2:选中要插入日历控件的单元格,设置单元格格式为日期型;
添加日期选择器步骤3:点击工具栏,“插入—对象—日历控件”,
添加日期选择器步骤4:用快捷方式Alt+F11,双击插入控件的工作表名称,粘贴下面的代码,用来实现单击A1时弹出日历控件,单击日历控件后,将选中的日期值填入A1并隐藏控件。
Private Sub Calendar1_Click()
ActiveCell = Calendar1
Calendar1.Visible = False
[a2].Select
End Sub
Private Sub Worksheet_SelectionChange(ByVal Target As Range)
If Target.Address = "$A$1" Then Calendar1.Visible = True
End Sub。
Calendar(日历控件)
DateTime的只读属性
属性名称说明
Date返回日期部分
Day返回月份中的日期
DayOfWeek返回一周中的日期,如Friday,Saturday等
DayOfYear返回年份中的日期
Hour返回小时部分
Millisecond返回毫秒部分
Minute返回分钟部分
Month返回月部分
DayRender事件处理程序接收两个DayRenderEventArgs类型的参数。
该对象有两个属性,它们可以用编程方式读取:
Cell表示要呈现的单元格的表格单元格对象。
Day表示呈现在单元格中日期的CalendarDay对象。
例如:
添加事件:
OnDayRender="Calendar1_DayRender"
VisibleDate显示月份的任意日期
在Calendar中选择日期
如果需要让用户可以选择一天、一周或一个月,则必须设置SelectionMode属性。
CalendarSelectionMode枚举成员
Day允许用户选择单个日期。这是默认值
DayWeek允许用户选择单个日期或整周
DayWeekMonth允许用户选择单个日期、周或整个月
IsToday指示该日期是否是今天
IsWeekend指示该日期是否是周末
VisibleMonthChanged事件当用户单击标题标头上的下个月或上个月导航控件时发生
例如:
添加事件:
OnVisibleMonthChanged="Calendar1_VisibleMonthChanged"
事件处理程序:
Second返回秒部分
excel中实现日期选择输入(日历控件)
excel中实现日期选择输入(日历控件)推荐第一种方法:首先这个控件需要一个名为MSCOMCT2.OCX的控件文件,这个文件大家先在电脑里搜索一下,如果没有的话就求助baidu 喽.下载下来后把它复制到c:\windows\system32里.最后就在开始->运行里注册MSCOMCT2.OCX控件.那么如何注册呢,方法很简单输入regsvr32 MSCOMCT2.OCX就ok拉这时打开excel控件工具箱点击其它控件找到Microsoft Date and Time Picker Control 6.0,这个东东就是我们要的日期控件拉第二种方法:MSCAL.OCXPrivate Sub Calendar1_Click()ActiveCell = Calendar1.ValueMe.Calendar1.Visible = FalseEnd SubPrivate Sub Worksheet_SelectionChange(ByVal Target As Range)'此处的6和7为你要显示日历的列序号If Target.Column = 6 Or Target.Column = 7 ThenMe.Calendar1.Left = Target.LeftMe.Calendar1.Top = Target.TopIf Target.Value <> "" ThenMe.Calendar1.Value = Target.ValueElseMe.Calendar1.Value = Now()End IfMe.Calendar1.Visible = TrueElseMe.Calendar1.Visible = FalseEnd IfEnd SubPrivate Sub Calendar1_Click()ActiveCell = Calendar1.ValueMe.Calendar1.Visible = FalseEnd SubPrivate Sub Worksheet_SelectionChange(ByVal Target As Range)'此处的1为你要显示日历的列序号If Selection.Rows.Count = 1 And Selection.Columns.Count = 1 AndTarget.Column = 1 ThenMe.Calendar1.Left = Target.LeftMe.Calendar1.Top = Target.TopIf Target.Value <> "" ThenMe.Calendar1.Value = Target.ValueElseMe.Calendar1.Value = Now()End IfMe.Calendar1.Visible = TrueElseMe.Calendar1.Visible = FalseEnd IfEnd SubMscomct2.zipMSCAL.rar在EXCEL中实现点击日历输入日期技巧2010-07-07 10:37:58 阅读435 评论0 字号:大中小订阅1、在某一单元格中插入日历控件(1)选中要插入日历控件的单元格,设置单元格格式为日期型;(2)点击工具栏,“插入—对象—日历控件”,(3)用快捷方式Alt+F11,双击插入控件的工作表名称,粘贴下面的代码,用来实现单击A1时弹出日历控件,单击日历控件后,将选中的日期值填入A1并隐藏控件。
JS制作简单的日历控件【JS Date对象练习实例】
JS制作简单的日历控件【JS Date对象练习实例】一直对JS 中的Date 对象不是很熟练,缺乏操作实践,端午节抽空复习了一下,做了一个简单的日期选择控件日历外观参考了淘宝旅行中的日期控件,控件只有基本功能,木有做节日显示,木有做IE6的SELECT遮挡控制,仅供练习:使用方法:只需传入日期INPUT元素的ID即可,isSelect选项为是否为SELECT下拉选择年月设置var myDate1 = new Calender({id:'j_Date1'});var myDate2 = new Calender({id:'j_Date2',isSelect:!0});演示如下:支持选择年月支持SELECT选择年月没空做教程啦,有兴趣的看源代码吧,详细源代码+注释如下:<!DOCTYPE HTML><html><head><meta charset="utf-8"><title>日历组件示例</title><style>.calendar{font-family:Tahoma; background:#fff; float:left; border-style:solid; border-width:1px; border-color:#85BEE5 #3485C0 #3485C0 #85BEE5; position:relative; padding:10px; overflow:hidden;}.calendar dl,.calendar dd{margin:0; padding:0; width:183px; font-size:12px; line-height:22px;}.calendar dt.title-date{ display:block; border-bottom:1px solid #E4E4E4; font-weight:700; position:relative; margin-bottom:5px;}.calendar dt{ float:left; width:25px; margin-left:1px; text-align:center;}.calendar dt.title-date{ width:100%;}.calendar dd{clear: both;width: 183px;height: 139px;font-weight: 700;background:url(/cnblogs_com/NNUF/379856/o_bg.png) no-repeat; margin:0;}.prevyear,.nextyear, .prevmonth,.nextmonth{cursor:pointer;height:9px; background:url(/cnblogs_com/NNUF/379856/o_nextprv.png)no-repeat; overflow:hidden;position:absolute; top:8px; text-indent:-999px;}.prevyear{ left:4px; width:9px;}.prevmonth{ width:5px; background-position:-9px 0; left:20px;}.nextyear{ width:9px; background-position:-19px 0; right:5px;}.nextmonth{ width:5px; background-position:-14px 0; right:20px;}.calendar dd a{float: left;width: 25px;height: 22px; color:blue; overflow: hidden; text-decoration: none;margin: 1px 0 0 1px; text-align:center;}.calendar dd a.disabled{color:#999;}.calendar dd a.tody{ color:red; }.calendar dd a.on{background:blue; color:#fff;}.calendar dd a.live{cursor:pointer}.input{ border:1px solid #ccc; padding:4px; background:url(/cnblogs_com/NNUF/379856/o_nextprv.png)no-repeat right -18px;}</style></head><body><br/><br/><h3>支持选择年月 支持SELECT选择年月</h3><div><input type="text" id="j_Date1" class="input"> <input type="text" id="j_Date2" class="input"></div><br/><div></div><!--日历控件JS源码--><script>/*** @namespace _CalF* 日历控件所用便捷函数* */_CalF = {// 选择元素$:function(arg,context){var tagAll,n,eles=[],i,sub = arg.substring(1);context = context||document;if(typeof arg =='string'){switch(arg.charAt(0)){case '#':return document.getElementById(sub);break;case '.':if(context.getElementsByClassName) return context.getElementsByClassName(sub);tagAll = _CalF.$('*',context);n = tagAll.length;for(i = 0;i<n;i++){if(tagAll[i].className.indexOf(sub) > -1) eles.push(tagAll[i]);}return eles;break;default:return context.getElementsByTagName(arg);break;}}},// 绑定事件bind:function(node,type,handler){node.addEventListener?node.addEventListener(type, handler, false):node.attachEvent('on'+ type, handler);},// 获取元素位置getPos:function (node) {var scrollx = document.documentElement.scrollLeft || document.body.scrollLeft,scrollt = document.documentElement.scrollTop || document.body.scrollTop;pos = node.getBoundingClientRect();return {top:pos.top + scrollt, right:pos.right + scrollx, bottom:pos.bottom + scrollt, left:pos.left + scrollx }},// 添加样式名addClass:function(c,node){node.className = node.className + ' ' + c;},// 移除样式名removeClass:function(c,node){var reg = new RegExp("(^|\\s+)" + c + "(\\s+|$)","g");node.className = node.className.replace(reg, '');},// 阻止冒泡stopPropagation:function(event){event = event || window.event;event.stopPropagation ? event.stopPropagation() : event.cancelBubble = true;}};/*** @name Calender* @constructor* @created by VVG* @/NNUF/* @mysheller@* */function Calender() {this.initialize.apply(this, arguments);}Calender.prototype = {constructor:Calender,// 模板数组_template :['<dl>','<dt class="title-date">','<span class="prevyear">prevyear</span><span class="prevmonth">prevmonth</span>','<span class="nextyear">nextyear</span><span class="nextmonth">nextmonth</span>','</dt>','<dt><strong>日</strong></dt>','<dt>一</dt>','<dt>二</dt>','<dt>三</dt>','<dt>四</dt>','<dt>五</dt>','<dt><strong>六</strong></dt>','<dd></dd>','</dl>'],// 初始化对象initialize :function (options) {this.id = options.id; // input的IDthis.input = _CalF.$('#'+ this.id); // 获取INPUT元素this.isSelect = options.isSelect; // 是否支持下拉SELECT选择年月,默认不显示this.inputEvent(); // input的事件绑定,获取焦点事件},// 创建日期最外层盒子,并设置盒子的绝对定位createContainer:function(){// 如果存在,则移除整个日期层Containervar odiv = _CalF.$('#'+ this.id + '-date');if(!!odiv) odiv.parentNode.removeChild(odiv);var container = this.container = document.createElement('div');container.id = this.id + '-date';container.style.position = "absolute";container.zIndex = 999;// 获取input表单位置inputPosvar input = _CalF.$('#' + this.id),inputPos = _CalF.getPos(input);//console.log(inputPos.top + ':' + inputPos.right + ' ' + inputPos.bottom + ' ' + inputPos.left);// 根据input的位置设置container高度container.style.left = inputPos.left + 'px';container.style.top = inputPos.bottom - 1 + 'px';// 设置日期层上的单击事件,仅供阻止冒泡,用途在日期层外单击关闭日期层_CalF.bind(container, 'click', _CalF.stopPropagation);document.body.appendChild(container);},// 渲染日期drawDate:function (odate) { // 参数odate 为日期对象格式var dateWarp, titleDate, dd, year, month, date, days, weekStart,i,l,ddHtml=[],textNode;var nowDate = new Date(),nowyear = nowDate.getFullYear(),nowmonth = nowDate.getMonth(),nowdate = nowDate.getDate();this.dateWarp = dateWarp = document.createElement('div');dateWarp.className = 'calendar';dateWarp.innerHTML = this._template.join('');this.year = year = odate.getFullYear();this.month = month = odate.getMonth()+1;this.date = date = odate.getDate();this.titleDate = titleDate = _CalF.$('.title-date', dateWarp)[0];// 是否显示SELECTif(this.isSelect){var selectHtmls =[];selectHtmls.push('<select>');for(i = 2020;i>1970;i--){if(i != this.year){selectHtmls.push('<option value ="'+ i +'">'+ i +'</option>');}else{selectHtmls.push('<option value ="'+ i +'" selected>'+ i +'</option>');}}selectHtmls.push('</select>');selectHtmls.push('年');selectHtmls.push('<select>');for(i = 1;i<13;i++){if(i != this.month){selectHtmls.push('<option value ="'+ i +'">'+ i +'</option>');}else{selectHtmls.push('<option value ="'+ i +'" selected>'+ i +'</option>');}}selectHtmls.push('</select>');selectHtmls.push('月');titleDate.innerHTML = selectHtmls.join('');// 绑定change事件this.selectChange();}else{textNode = document.createTextNode(year + '年' + month + '月');titleDate.appendChild(textNode);this.btnEvent();}// 获取模板中唯一的DD元素this.dd = dd = _CalF.$('dd',dateWarp)[0];// 获取本月天数days = new Date(year, month, 0).getDate();// 获取本月第一天是星期几weekStart = new Date(year, month-1,1).getDay();// 开头显示空白段for (i = 0; i < weekStart; i++) {ddHtml.push('<a> </a>');}// 循环显示日期for (i = 1; i <= days; i++) {if (year < nowyear) {ddHtml.push('<a class="live disabled">' + i + '</a>');} else if (year == nowyear) {if (month < nowmonth + 1) {ddHtml.push('<a class="live disabled">' + i + '</a>');} else if (month == nowmonth + 1) {if (i < nowdate) ddHtml.push('<a class="live disabled">' + i + '</a>');if (i == nowdate) ddHtml.push('<a class="live tody">' + i + '</a>');if (i > nowdate) ddHtml.push('<a class="live">' + i + '</a>');} else if (month > nowmonth + 1) {ddHtml.push('<a class="live">' + i + '</a>');}} else if (year > nowyear) {ddHtml.push('<a class="live">' + i + '</a>');}}dd.innerHTML = ddHtml.join('');// 如果存在,则先移除this.removeDate();// 添加this.container.appendChild(dateWarp);// A link事件绑定this.linkOn();// 区域外事件绑定this.outClick();},// SELECT CHANGE 事件selectChange:function(){var selects,yearSelect,monthSelect,that = this;selects = _CalF.$('select',this.titleDate);yearSelect = selects[0];monthSelect = selects[1];_CalF.bind(yearSelect, 'change',function(){var year = yearSelect.value;var month = monthSelect.value;that.drawDate(new Date(year, month-1, that.date));});_CalF.bind(monthSelect, 'change',function(){var year = yearSelect.value;var month = monthSelect.value;that.drawDate(new Date(year, month-1, that.date));})},// 移除日期DIV.calendarremoveDate:function(){var odiv = _CalF.$('.calendar',this.container)[0];if(!!odiv) this.container.removeChild(odiv);},// 上一月,下一月按钮事件btnEvent:function(){var prevyear = _CalF.$('.prevyear',this.dateWarp)[0],prevmonth = _CalF.$('.prevmonth',this.dateWarp)[0],nextyear = _CalF.$('.nextyear',this.dateWarp)[0],nextmonth = _CalF.$('.nextmonth',this.dateWarp)[0],that = this;prevyear.onclick = function(){var idate = new Date(that.year-1, that.month-1, that.date);that.drawDate(idate);};prevmonth.onclick = function(){var idate = new Date(that.year, that.month-2,that.date);that.drawDate(idate);};nextyear.onclick = function(){var idate = new Date(that.year + 1,that.month - 1, that.date);that.drawDate(idate);};nextmonth.onclick = function(){var idate = new Date(that.year , that.month, that.date);that.drawDate(idate);}},// A 的事件linkOn:function(){var links = _CalF.$('.live',this.dd),i,l=links.length,that=this;for(i = 0;i<l;i++){links[i].index = i;links[i].onmouseover = function(){_CalF.addClass("on",links[this.index]);};links[i].onmouseout = function(){_CalF.removeClass("on",links[this.index]);};links[i].onclick = function(){that.date = this.innerHTML;that.input.value = that.year + '-' + that.month + '-' + that.date;that.removeDate();}}},// 表单的事件inputEvent:function(){var that = this;_CalF.bind(this.input, 'focus',function(){that.createContainer();that.drawDate(new Date());});_CalF.bind(this.input, 'click',_CalF.stopPropagation);},// 鼠标在对象区域外点击,移除日期层outClick:function(){var that = this;_CalF.bind(document, 'click',function(){that.removeDate();})}};var myDate1 = new Calender({id:'j_Date1'});var myDate2 = new Calender({id:'j_Date2',isSelect:!0});</script></body></html>。
关于如何在EXCEL中添加日历控件,最全最好的方法
1、选择excel的常规里选择显示开发工具图表1 选择自定义工具栏选择开发工具图表2选择开发工具2、选择插入-〉表单控件-〉其它选择其它图表3选择其它控件图表4选择日历控件3、双击界面控件,在‘通用’加入如下代码(注意:Target.Column = 4里的是指D列就是固定的4列,G列是7列,而不是sheet里D,G列真实对应的第几列):Private Sub Calendar1_Click()ActiveCell = Format(Calendar1.Value, "yyyy-mm-dd") '设置日期格式,此工作可以直接通过设置某列单元格格式一次性完成Calendar1.Visible = False '单击日历控件后隐藏之End SubPrivate Sub Worksheet_SelectionChange(ByVal Target As Range)If Target.Column = 4 Then 'D列为日期输入列,只对应excel的字母列,例如D对应4, 'G对应7,不是实际的显示列对应的数字Calendar1.Left = Target.Left + Target.Width '设置日历控件弹出后的位置Calendar1.Top = Target.Top + Target.Height '同上Calendar1.Value = Date '设置默认日期为系统日期Calendar1.Visible = True '使日历控件可见ElseIf Target.Column = 5 Then 'E列为日期输入列Calendar1.Left = Target.Left + Target.WidthCalendar1.Top = Target.Top + Target.HeightCalendar1.Value = DateCalendar1.Visible = TrueElseIf Target.Column = 6 Then 'F列为日期输入列Calendar1.Left = Target.Left + Target.WidthCalendar1.Top = Target.Top + Target.HeightCalendar1.Value = DateCalendar1.Visible = TrueElseCalendar1.Visible = False '单击其他列时隐藏日历控件End IfEnd Sub保存。
Excel日历控件教程(详细)
1.Alt+F11 按下显示代码窗口后,再松开Alt+F11。
2.然后按F7 ,调出VBA 窗口。
3.粘贴以下代码.Private Sub Calendar1_Click()Dim MyDay As DateActiveCell = Calendar1.ValueMydate = Calendar1。
Value’MsgBox MydateCalendar1.Visible = 0End SubPrivate Sub Worksheet_SelectionChange(ByVal Target As Range)If Target。
Column = 1 Or Target。
Column = 1 And Target.Row > 0 ThenIf IsDate(Target) ThenCalendar1。
Value = TargetElseCalendar1。
TodayEnd IfCalendar1。
Visible = —1Calendar1。
Top = ActiveCell。
Top + ActiveCell。
HeightCalendar1.Left = ActiveCell.Left + Cells(ActiveCell。
Rows.Count, 3).Left ElseCalendar1.Visible = 0End IfEnd Sub4.打开文件→保存book1(S)5.打开视图→对象窗口6.打开插入→对象窗口7.找到日历控件11.0或9.0,按确定退出。
8。
单击第一列(A列)中的任一单元格,选择日历中的需要的日期即可。
备注:要改变日期输入位置,可按以下方法调整代码,找到下面的代码行(此代码行的意思是在A列(第1列)中添加日历。
If Target.Column = 1 Or Target。
Column = 1 And Target.Row > 0 Then然后根据以下的方法覆盖粘贴此行代码1.以下这一句就是 B3:C5区域调用日期控件.If Target.Column = 2 And Target.Row 〉 2 And Target.Row < 6 Or Target.Column = 3 And Target。
日期选择插件
".out { text-align: center; border-top: 1px solid "+ parent.DarkBorder +"; border-left: 1px solid "+
* 为输出的日期格式。
*
* 因为本日历控件的图片使用的是相对路径,所以因页面所在文件夹的不同有可能图片显示不出来,
* 这时请修改图片相对路径: this.imageRelativePath = "/pageComponent/resources/images/calendar";
*
*/
//日期控件高度 19+20+120+19+20
function writeIframe(parent) //对iframe进行初始化
{
var strIframe = "<html><head><meta http-equiv='Content-Type' content='text/html; charset=gb2312'><style>"+
"border-bottom: 1px solid "+ parent.DarkBorder +"; border-right: 1px solid "+ parent.DarkBorder +"}"+
在Excel中如何实现选择日历控件
在Excel中如何实现选择日历控件,就将日期插入到指定的单元格?请跟随如下操作;在EXCEL窗口中执行“视图”→“工具栏”→“控件工具箱”;弹出如下图对话框;按上图的操作,找到“日历控件11.0”,之后在EXCEL窗口中使用鼠标左键一拖,拖出如下图的控件;上图,我们要实现的结果是:在C列中,无论点击哪个单元格,就弹出日历控件,选择一个日期之后,日期自动插入到单元格;除C列之外,点击其他列的单元格,不会弹出日历选择控件;要想实现这样的效果,得使用VBA来实现;选择日历控件,鼠标左键双击,进入代码编辑模式;如下图!上图中,第一个过程代码就是日历控件所需要的代码,另外,还得需要另外一个代码,在图中按红线圈住部分选择,找到对应的过程,输入如下的VBA代码即可!完成之后,直接运行VBA代码,返回EXCEL操作窗口,即可实现效果了!如上图,C3单元格已插入了日期,当你选择C列其他单元格时,就弹出日历控件,以供选择,选择完成,即可插入日期了!为方便操作,提供源代码:Private Sub Calendar1_Click()ActiveCell = Calendar1.ValueMe.Calendar1.Visible = FalseEnd SubPrivate Sub Worksheet_SelectionChange(ByVal Target As Range)If Target.Column = 1 ThenMe.Calendar1.Visible = TrueElseMe.Calendar1.Visible = FalseEnd IfEnd Sub知识扩展:①执行上述代码时,可能会遇到创建宏的提示,随便输入宏名,再运行即可!②可以将上述的代码及EXCEL文件一起保持,以备不时之需,以后你再需要到这种功能,直接打开EXCEL文件即可!打开EXCEL文件,运行原来的宏,有可能出现“宏”被禁止运行的提示,解决的方法如下:在EXCEL操作中执行“工具”→“宏”→“安全性”;弹出如下的对话框;上图中,选择“安全级”选项卡,将安全设置为“中”即可!之后关闭EXCEL,再打开,就能运行了!。
Axure交互实例教程:日历控件选择日期
Axure交互实例教程:日历控件选择日期
Axure交互实例教程:日历控件选择日期
欢迎大家在查看本栏目!以下是我们给大家整理出来的Axure常用交互实例教程。
我相信,这些也肯定是很多朋友在关心的,所以我就给大家谈谈这个!
1.日历控件
第一步:
从控件库中拖出两个文本面板和一个矩形框。
一个文本面板控件中输入“选择日期”(标签命名为文本1),另一个输入一个默认日期(标签命名为文本2),编辑文本框控件的'属性为:文本框。
第二步:
打开日历控件,这里需要注意下,一般自带控件库中是没有日历控件的,这里可以在网上下载一个,我这里直接用一个之前已经做好的自定义控件:
第三步:
将刚才的日历控件组合成一个控件,右键转化为动态面板,设置标签为:日历控件,将其拖动到文本框下方,设置为隐藏,如图:
2.添加事件
第一步:
点击文本框2,添加OnClick事件:
第二步:
双击“日历控件”下的动态面板,选择26添加事件:
1) 设置文本2的值,即选择26时,将选中的值等于文本2;
2) 选中的同时需要隐藏日历控件;
(此处数字随便选取,由于axure本身的局限性,如果想查个多个选中日期的效果,按照此步骤多设置几个数字即可)
第三步:
选中20,重复第二步的操作;(这样选择26号和14号都可以传递到文本2中)
设置好之后点击保存,生成网页就能看到效果了。
如果你下载的日历控件有完整月份,那么可以直接把切换月份的交互实例与日期结合,这样整个日历的交互就搞定可,各位可以试试看~~
【Axure交互实例教程:日历控件选择日期】。
PyQt5日历控件及相关操作
PyQt5⽇历控件及相关操作1、⽇历控件QCalendarWidget控件import sys,mathfrom PyQt5.QtWidgets import *from PyQt5.QtGui import *from PyQt5.QtCore import *class mycalendar(QWidget):def __init__(self):super(mycalendar,self).__init__()self.initUI()def initUI(self):self.cal=QCalendarWidget(self)self.cal.setMinimumDate(QDate(1988,1,1)) #设置⽇历的最⼤最⼩⽇期self.cal.setMaximumDate(QDate(2088,1,1))self.cal.clicked.connect(self.showdate)self.cal.setGridVisible(True) #设置⽇历为⽹格形式self.cal.move(20,20)self.setWindowTitle("⽇历演⽰")bel = QLabel(self)date = self.cal.selectedDate()#bel.setText("显⽰选择⽇期")bel.setText(date.toString("yyyy-MM-dd dddd"))bel.move(20, 320)self.resize(400,400)def showdate(self,date):bel.setText(date.toString("yyyy-MM-dd dddd"))if __name__=="__main__":app=QApplication(sys.argv)p=mycalendar()p.show()sys.exit(app.exec_())2、不同显⽰风格的⽇历import sys, mathfrom PyQt5.QtWidgets import *from PyQt5.QtGui import *from PyQt5.QtCore import *class DatetimeEdit(QWidget):def __init__(self):super(DatetimeEdit, self).__init__()self.initUI()def initUI(self):vlayout=QVBoxLayout()datetimeEdit1=QDateTimeEdit()datetimeEdit2 = QDateTimeEdit(QDateTime.currentDateTime()) dateedit=QDateTimeEdit(QDate.currentDate())timeedit=QDateTimeEdit(QTime.currentTime())datetimeEdit1.setDisplayFormat("yyyy-MM-dd HH:mm:ss")datetimeEdit2.setDisplayFormat("yyyy/MM/dd HH-mm-ss") dateedit.setDisplayFormat("yyyy.MM.dd")timeedit.setDisplayFormat("HH:mm:ss")vlayout.addWidget(datetimeEdit1)vlayout.addWidget(datetimeEdit2)vlayout.addWidget(dateedit)vlayout.addWidget(timeedit)self.setLayout(vlayout)self.resize(300, 90)self.setWindowTitle("设置不同风格的⽇期")if __name__ == "__main__":app = QApplication(sys.argv)p = DatetimeEdit()p.show()sys.exit(app.exec_())3、⽇历控件QDateEdit控件,⽇历的⾼级操作import sys, mathfrom PyQt5.QtWidgets import *from PyQt5.QtGui import *from PyQt5.QtCore import *class DatetimeEdit(QWidget):def __init__(self):super(DatetimeEdit, self).__init__()self.initUI()def initUI(self):vlayout=QVBoxLayout()datetimeEdit1=QDateTimeEdit()datetimeEdit2 = QDateTimeEdit(QDateTime.currentDateTime()) #获取当前的⽇期和时间datetimeEdit1.setMinimumDate(QDate.currentDate().addDays(-365))datetimeEdit1.setMaximumDate(QDate.currentDate().addDays(365))self.datetimeedit=datetimeEdit1datetimeEdit2.setCalendarPopup(True) #将⽂本的⽇历显⽰格式转换为下拉式表格显⽰dateedit=QDateTimeEdit(QDate.currentDate())timeedit=QDateTimeEdit(QTime.currentTime())datetimeEdit1.setDisplayFormat("yyyy-MM-dd HH:mm:ss")datetimeEdit2.setDisplayFormat("yyyy/MM/dd HH-mm-ss")dateedit.setDisplayFormat("yyyy.MM.dd")timeedit.setDisplayFormat("HH:mm:ss")datetimeEdit1.dateChanged.connect(self.ondatechanged)datetimeEdit1.timeChanged.connect(self.ontimechanged)datetimeEdit1.dateTimeChanged.connect(self.ondatetimechanged)vlayout.addWidget(datetimeEdit1)vlayout.addWidget(datetimeEdit2)vlayout.addWidget(dateedit)vlayout.addWidget(timeedit)self.button=QPushButton("获取⽇期和时间")self.button.clicked.connect(self.onButtonClick)vlayout.addWidget(self.button)self.setLayout(vlayout)self.resize(300, 90)self.setWindowTitle("设置不同风格的⽇期")#⽇期变化def ondatechanged(self,date):print(date)#时间变化def ontimechanged(self,time):print(time)#⽇期和时间变化def ondatetimechanged(self,datetime):print(datetime)def onButtonClick(self):datetime=self.datetimeedit.dateTime()print(datetime)#最⼤⽇期print(self.datetimeedit.maximumDate())#最⼤时间和⽇期print(self.datetimeedit.maximumDateTime())#最⼩⽇期print(self.datetimeedit.minimumDate())print(self.datetimeedit.minimumDateTime())if __name__ == "__main__":app = QApplication(sys.argv)p = DatetimeEdit()p.show()sys.exit(app.exec_())。
elementui日历控件选择器校验
elementui⽇历控件选择器校验element ui⽇历控件选择器校验使⽤element UI+vue页⾯时,搜索⽇期是出现频次较⾼的搜索条件之⼀,这⾥以element⾃带的⽇期控件为例,实现开始与结束⽇期之间的校验:<el-form:model="searchData":inline="true"><el-form-itemlabel="开始⽇期"prop="openTime"><el-date-pickerv-model="searchData.openTime"type="date":picker-options="pickerOptionsStart"/></el-form-item><el-form-itemlabel="结束⽇期"prop="closeTime"><el-date-pickerv-model="searchData.closeTime"type="date":picker-options="pickerOptionsEnd"/></el-form-item></el-form>这是需要在data⾥⾯实现具体⽅法:写法⼀:// 可选⽇期范围pickerOptionsStart: {disabledDate: time => {if (this.searchData.closeTime) {return time.getTime() >= new Date(this.searchData.closeTime).getTime()}}},pickerOptionsEnd: {disabledDate: time => {if (this.searchData.openTime) {return time.getTime() <= new Date(this.searchData.openTime).getTime()}}}写法⼆(个⼈推荐):// 搜索起始⽇期限制pickerOptionsStart: {disabledDate: time => {let endTime = new Date(this.searchData.researchEndDate).getTime()if (endTime) {return time.getTime() > endTime}}},// 搜索终⽌⽇期限制pickerOptionsEnd: {disabledDate: time => {let startTime = new Date(this.searchData.researchStartDate).getTime()if (startTime) {return time.getTime() < startTime}}}效果:前---后---。
wps表格添加日历控件图文教程
wps表格添加日历控件图文教程
在制作wps表格的时候,怎么去使用日历控件呢?新手不会,上网找怕麻烦,而且教程太乱没有统一的答案怎么办,哪里有更好的方法?下面店铺就为你介绍wps表格怎么使用日历控件的方法啦!
wps表格添加日历控件的方法
一、静态日期
1.“ctrl+;“插入静态日期,同时也可以自定义日期格式
2.选中日期,右击,在下拉菜单中选择“设置单元格格式”
3.在“数字”选项中,选择“自定义”,在右边的下拉菜单中可以自己设置日期格式,或者选择系统提供的格式,此例,小编选择系统提供的格式之一
4.效果如下图
二、动态日期
1.在需要插入日期的单元格输入公式“=today()”,就可以设置动态日期
2.效果图。
日历控件使用说明
轻量级的日历控件(适合移动端)
图片展示
图1. 主图样式
1.蓝色字体是当前日期;蓝色圆圈背景是选中的日期;
2.上方的箭头是切换月份;
3.日期那边可以左右滑动,切换天数;
参数修改介绍
样式修改:
1.打开index.html,在其头部有控制td样式和today,focus类。
如下图
2.td对应的就是日期的样式;today就是当前日期;focus就是选中的日期;可
以根据自己的需要进行修改。
左右侧滑修改:
1.为了方便大家在PC端的测试,特意将移动端的左右侧滑效果模拟出来,大
家如果要在移动端使用,只需要修改下列代码,如下图;
2.滑动时天数修改:滑动时调用changeData(type)方法,方法介绍如下图:
下载地址
百度云盘:/s/1c0zW7te。
Excel2020中添加日历控件的操作方法
Excel2020中添加日历控件的操作方法
通过菜单的开发工具插入日历控件。
首先在菜单区域右击,选择右击菜单的自定义工具栏customizetheribbon...,弹出对话框,将developer添加到右边,确认退出,则菜单栏就会出现developer选项。
选择developer项,然后点击insert,选择更多控件morecontrols,然后在弹出的窗口选择日历控件,确定退出。
这时候你会发现,鼠标光标变成了十字图标,点击需要添加日期的单元格,则日历添加成功。
添加的日历控件好像锁定了,点击下拉箭头根本没有反应,怎么回事呢?
原因是添加进来的控件是处于设计状态,这时候只要将设计状态取消,就可以选择日期了。
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
var s_tiannet_font = "color:#FFCC00;font-size:9pt;cursor:hand;";
//链接的样式
var s_tiannet_link = "text-decoration:none;font-size:9pt;color:#2650A6;";
var arrTiannetHide = new Array();//被强制隐藏的标签
var m_bolShowHour = false;//是否显示小时
var m_bolShowMinute = false;//是否显示分钟
var m_aMonHead = new Array(12); //定义阳历中每个月的最大天数
var tiannetDay = tiannetDateNow.getDate();
var tiannetHour = 8;//tiannetDateNow.getHours();
var tiannetMinute = 0;//tiannetDateNow.getMinutes();
var tiannetArrDay=new Array(42); //定义写日期的数组
//翻年、月等的按钮
var s_tiannet_turn = "width:28px;" + s_tiannet_turn_base;
//关闭、清空等按钮样式
var s_tiannet_turn2 = "width:22px;" + s_tiannet_turn_base;
//年选择下拉框
//横线
var s_tiannet_line = "border-bottom:1 solid #6699CC";
//------------------ 变量定义 ---------------------------//
var tiannetYearSt = 1950;//可选择的开始年份
*/
//------------------ 样式定义 ---------------------------//
//功能按钮同样样式
var s_tiannet_turn_base = "height:16px;font-size:9pt;color:white;border:0 solid #CCCCCC;cursor:hand;background-color:#2650A6;";
*设置参数的方法
* (1)设置日期分隔符 setDateSplit(strSplit);默认为"-"
* (2)设置日期与时间之间的分隔符 setDateTimeSplit(strSplit);默认为" "
* (3)设置时间分隔符 setTimeSplit(strSplit);默认为":"
/**
*本日历选择控件由tiannet根据前人经验完善而得。大部分代码来自meizz的日历控件。
*tiannet添加了时间选择功能、select,object标签隐藏功能,还有其它小功能。
*使用方法:
* (1)只选择日期 <input type="text" name="date" readOnly onClick="setDay(this);">
* (2)选择日期和小时 <input type="text" name="dateh" readOnly onClick="setDayH(this);">
* (3)选择日期和小时及分钟 <input type="text" name="datehm" readOnly onClick="setDayHM(this);">
"border-left:1 solid #CCCCCC;border-top:1 solid #CCCCCC;border-right:1 solid #999999;border-bottom:1 solid #999999;";
//显示日的td的样式
var s_tiannet_day = "width:21px;height:20px;background-color:#D8F0FC;font-size:10pt;";
* (4)设置(1),(2),(3)中的分隔符 setSplit(strDateSplit,strDateTimeSplit,strTimeSplit);
* (5)设置开始和结束年份 setYearPeriod(intDateBeg,intDateEnd)
*说明:
* 默认返回的日期时间格式如同:2005-02-02 08:08
var s_tiannet_select = "width:64px;display:none;";
//月、时、分选择下拉框
var s_tiannet_select2 = "width:46px;display:none;";
//日期选择控件体的样式
var s_tiannet_body = "width:150;background-color:#2650A6;display:none;z-index:9998;position:absolute;" +
var tiannetDateSplit = "-"; //日期的分隔符号
var tiannetDateTimeSplit = " "; //日期与时间之间的分隔符
var tiannetTimeSplit = ":"; //时间的分隔符号
var tiannetOutObject; //接收日期时间的对象
var tiannetYearEnd = //可选择的结束年份
var tiannetDateNow = new Date();
var tiannetYear = tiannetDateNow.getFullYear(); //定义年的变量的初始值
var tiannetMonth = tiannetDateNow.getMonth()+1; //定义月的变量的初始值