官网:http://www.jemui.com/uidoc/jedate.html#linkage
html:
<#list pointsDeductRuleList as deductRule> <tr class="aui-grid-row deduct deduct2"> <td style="width:0;"></td> <td class="aui-grid-cell" colspan="1"> <div class="aui-grid-cell-div"> <span style="padding-right: 20px;">活动日期:</span> <input class="pointsDeductStartDate" name="pointsDeductDate" type="text" autocomplete="off" readonly > <label style="float: none !important;">至</label> <input id="inpend" class="pointsDeductEndDate" name="pointsDeductDate" type="text" autocomplete="off" readonly > <span>金额满足:</span><input type="text" size="10" name="minAmount" > 元 <span> 总金额:</span><input type="text" size="10" name="maxDiscount" > % </div> </td> </tr> </#list>
js:
$(document).ready(function() { initDate(); }); function initDate(){ $('tr.deduct2').find('input.pointsDeductStartDate').each(function (ind,ele) { var eleEnd = $(ele).next().next(); var start = { format: 'YYYY-MM-DD', maxDate: eleEnd.val(), //最大日期 choosefun: function(elem,datas){ console.info($(elem).val()); end.minDate = datas; //开始日选好后,重置结束日的最小日期 } }; var end = { format: 'YYYY-MM-DD', minDate: $(ele).val(), //设定最小日期为当前日期 choosefun: function(elem,datas){ start.maxDate = datas; //将结束日的初始值设定为开始日的最大日期 } }; $(ele).jeDate(start); eleEnd.jeDate(end); }); }
网上其它示例:
【自定义日期格式】 <span class="wstxt">开始日期:</span><input type="text" class="workinput wicon mr25" id="inpstart" readonly> <span class="wstxt">结束日期:</span><input type="text" class="workinput wicon mr25" id="inpend" readonly> <script> var start = { format: 'YYYY-MM-DD hh:mm:ss', minDate: $.nowDate(0), //设定最小日期为当前日期 isinitVal:true, festival:true, ishmsVal:false, maxDate: '2099-06-30 23:59:59', //最大日期 choosefun: function(elem,datas){ end.minDate = datas; //开始日选好后,重置结束日的最小日期 } }; var end = { format: 'YYYY年MM月DD日 hh:mm:ss', minDate: $.nowDate(0), //设定最小日期为当前日期 festival:true, maxDate: '2099-06-16 23:59:59', //最大日期 choosefun: function(elem,datas){ start.maxDate = datas; //将结束日的初始值设定为开始日的最大日期 } }; $('#inpstart').jeDate(start); $('#inpend').jeDate(end); //或者是 $.jeDate('#inpstart',start); $.jeDate('#inpend',end); </script>
相关推荐
jeDate还支持更多高级功能,例如日期时间联动、日期范围选择、日期时间插件的独立使用等,开发者可以根据具体需求进行深入探索和应用。 ### 5. 总结 jeDate作为一款优秀的jQuery日期控件,凭借其丰富的功能、易用...
多功能jQuery日期控件 jeDate.zip 支持年月日,时分秒的选择。 请查看博客讲解:http://blog.csdn.net/TMaskBoy/article/details/51646994
MM)、日期范围限制、开始日期设定、自定义日期格式、当天的前后若干天返回、时分秒选择、智能响应、自动纠错、节日识别,操作等常规功能外,根据不同的日期格式,显示不同内容,还拥有更多趋近完美的解决方案。...
jeDate是一款大众化的日期控件,除了包含 单双面板、区域选择、 多语言、日历固定、有效无效日期、日期时间戳转换、日期加减、限制时分秒、初始化日期加减N、日期标注点、设定年月(YYYY-MM)、日期范围限制、开始...
总的来说,`jeDate`日期控件带时分秒日期选择器代码为前端开发者提供了一种高效、灵活的方式来处理日期和时间输入,它具有良好的可定制性和扩展性,是开发中一个值得推荐的工具。通过深入理解和应用`jeDate`,你可以...
在WPS Office的Excel应用中,日期控件是一种非常实用的功能,它允许用户在工作表中插入一个可交互的日历小部件,以便于选择和输入日期。标题“wps中excel日期控件下载”提示我们要关注如何在WPS Excel中获取和安装这...
9. **日期计算器(Date Calculator)**:允许用户通过加减操作计算日期,比如“从今天开始的30天后”或“前年的同一天”。 10. **自定义控件(Custom Control)**:开发者可以创建自己的日期控件,实现特定功能或界面...
在Excel VBA(Visual Basic for Applications)中,日期控件是一种非常实用的工具,它允许用户在用户界面中选择特定的日期,增强了交互性和数据输入的准确性。本篇将详细介绍如何在Excel VBA中使用日期控件,并提供...
QQ日期控件是一款广泛应用于网页开发中的时间选择组件,它为用户提供了一种便捷的方式来选取日期,常见于在线表单、日程安排等场景。QQ日期控件通常与JavaScript库结合使用,提供美观的用户界面和良好的交互体验。...
本篇文章将深入探讨PB8中的两种日期控件:独立日期控件和与数据窗口集成的日期控件。 1. 独立日期控件: 独立日期控件在PB8中称为DateEdit控件,它是一个单独的组件,可以在窗口或对话框中自由放置。DateEdit控件...
Axure9.0的高保真日期控件自定义格式,控件基于中继器算法实现,主要实现包含日历自动切换,默认当前年月,当前或选择值选中状态,点击隐藏日历等功能。 Axure9.0的高保真日期控件自定义格式,控件基于中继器算法...
2. **日期选择逻辑**: 控件需要有机制来允许用户选择开始日期和结束日期,并确保结束日期不能早于开始日期。这通常需要通过监听日期改变的事件,然后在后台进行有效性检查。 3. **日期范围限制**: 在酒店预订的例子...
1. **联动选择**:多个日期控件之间可以实现联动,例如一个选择开始日期,另一个自动更新为结束日期。 2. **异步加载数据**:在特殊情况下,如节假日表,可以通过异步请求获取并填充到日期控件中。 3. **自定义工具...
在本文中,我们将深入探讨如何使用layui框架中的日期控件laydate实现开始和结束时间的联动控制。这种功能常见于需要用户输入一个时间段的场景,例如预约、计划设定等,确保用户选择的结束时间在开始时间之后。 首先...
在IT领域,尤其是在前端开发中,"可多选的日期控件"是一个常见的需求,它允许用户在日历界面中选择多个日期,而非只能选择单个日期。这种控件广泛应用于各种应用程序,如行程规划、会议安排或者数据分析等场景。在本...
在网页开发中,日期控件是一种常见的用户交互组件,它允许用户方便地选择日期,常用于表单填充或事件预订等场景。本压缩包提供的是一款跨浏览器的JS日期控件,兼容IE、Firefox和Chrome这三种主流浏览器,为开发者...
许多日期控件支持联动选择,即选择一个开始时间后,会自动跳转到另一个输入框选择结束时间。例如,DateTimeRangePicker 是一个专门用于选择时间范围的组件,它可以方便地配置开始和结束时间的格式及联动行为。 四、...