datepicher插件是jQuery UI的一个插件，它提供一个日期弹出窗口（或直接显示在页面），供用户选择日期。在Web开发中，总会遇到需要用户输入日期的情况。一般都是提供一个text类型的input供用户输入日期，我们在实际开发中会遇到给日期控件设置默认日期的情况，下面我们就举例解释jquery easyui datepickerx控件是如何实现设置默认日期的：
1 <%@page pageEncoding="UTF-8"%> 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 3 <%@include file="/coframe/tools/skins/common.jsp" %> 4 <%@taglib uri="http://org.gocom.components.authTag/tag" prefix="auth" %> 5 <%@include file="/common.jsp" %> 6 <html> 7 <!-- 8 - Author(s): caowenliang 9 - Date: 2016-07-15 12:08:01 10 - Description: 11 --> 12 <head> 13 <title>回款里程碑审核</title> 14 <style type="text/css"> 15 .New_Button, .Edit_Button, .Delete_Button, .Update_Button, .Cancel_Button 16 { 17 font-size:11px;color:#1B3F91;font-family:Verdana; 18 margin-right:5px; 19 } 20 .monthrow 21 { 22 background:#fceee2; 23 } 24 </style> 25 <body> 26 <div> 27 <div id="form1" style="padding-top:0px;"> 28 <fieldset style="97%;height:100%;border:solid 1px #aaa;margin-top:0px;position:relative;"> 29 <legend>申请信息</legend> 30 <div><label>完工日期：</label> 31 <td><input id="rfinish_date" class="nui-datepickerx" enabled="false"/></td> 32 <td><input id="attachmentId" class="nui-hidden"/></td> 33 </div> 34 <fieldset style="float:left;40%;height:150px;border:solid 1px #aaa;margin-top:0px;position:relative;"> 35 <legend>附件信息</legend> 36 <div class="nui-toolbar;" style="border-bottom:0;padding:0px;"> 37 <table > 38 <tr><!-- 文件上传 --> 39 <td style="40%">下载附件：</td> 40 <td style="white-space:nowrap;" ><div id='download'></div></td> 41 <td > 42 <input id="fileid" name="dpGdAdj.fileid" class="nui-hidden" /> 43 </td> 44 </tr> 45 </table> 46 </div> 47 </fieldset> 48 <fieldset style="float:right;border:solid 1px #aaa;margin-top:0px;position:relative;54%;height:150px;"> 49 <legend>交付物计划</legend> 50 <div class="nui-fit"> 51 <div id="datagrid1" class="nui-datagrid" style="100%;height:100%;" dataField="data" 52 url="com.shtech.dp2.prjplan.ProjectManager.queryPod.biz.ext" multiSelect="true" 53 allowCellEdit="true" allowCellSelect="true" editNextOnEnterKey="true" 54 idField="podid" showPager="false" showFooter="false" allowSortColumn="false"> 55 <div property="columns"> 56 <div type="checkcolumn"></div> 57 <div field="podid" visible="false"><!-- 交付物ID --></div> 58 <div field="podname" width="100" headerAlign="center" allowSort="true" vtype="required">交付物名称 59 <input property="editor" class="nui-textbox" style="100%;" maxLength="25"/> 60 </div> 61 <div field="comcriteria" width="60" renderer="renderComcriteria" allowSort="true" align="center" headerAlign="center">完成标准 62 <input property="editor" class="nui-dictcombobox" dictTypeId="DP2_COMCRITERIA" /> 63 </div> 64 <div field="carrformat" width="70" renderer="renderCarrformat" allowSort="true" align="center" headerAlign="center">载体形式 65 <input property="editor" class="nui-dictcombobox" dictTypeId="DP2_CARRFORMAT" /> 66 </div> 67 <div field="demandtype" width="60" renderer="renderDemandtype" allowSort="true" align="center" headerAlign="center">要求来源 68 <input property="editor" class="nui-dictcombobox" dictTypeId="DP2_DEMANDTYPE" /> 69 </div> 70 <div field="baseline" width="70" renderer="renderBaseline" allowSort="true" align="center" headerAlign="center">基线名称 71 <input property="editor" class="nui-dictcombobox" dictTypeId="DP2_BASELINE" /> 72 </div> 73 <div type="comboboxcolumn" field="gcMscellid" width="100" headerAlign="center" vtype="required" >所属里程碑 74 <input property="editor" class="nui-combobox" style="100%;" 75 data="listData" /> 76 </div> 77 </div> 78 </div> 79 </div> 80 </fieldset> 81 <table> 82 <label>差异说明：</label> 83 <td><textarea id="note" class="nui-textarea" style="860px;" emptyText="请输入差异说明" ></textarea></td> 84 </tr> 85 </table> 86 </fieldset> 87 <fieldset style="97%;height:100%;border:solid 1px #aaa;margin-top:4px;position:relative;"> 88 <label>确认日期：</label> 89 <td><input id="cfmddate" class="nui-datepickerx" required="true"/></td></br> 90 <table> 91 <label>审批意见：</label> 92 <td><textarea id="note" class="nui-textarea" style="860px;" emptyText="请输入审批意见" ></textarea></td> 93 </tr> 94 <tr> 95 <td style="text-align:center;"> 96 <a class="nui-button" iconCls="icon-save" onclick="onok">通过</a> 97 <span style="display:inline-block;1;"></span> 98 <a class="nui-button" iconCls="icon-save" onclick="no">驳回</a> 99 <span style="display:inline-block;25px;"></span> 100 <a class="nui-button" iconCls="icon-cancel" onclick="onCancel">取消</a> 101 </td> 102 </tr> 103 </table> 104 </fieldset> 105 <div> 106 </div> 107 </div> 108 </div> 109 </div> 110 </body> 111 <script type="text/javascript"> 112 nui.get("rfinish_date").setValue(new Date()); 113 nui.get("cfmddate").setValue(new Date()); 114 </script> 115 </html>
看页面展示效果：
