日期时间插件WdatePicker.js使用方法

官网:http://www.my97.net/demo/index.htm

支持浏览器

IE 6.0+ , Firefox 2.0+ , Chrome, Opera 9.5+ , Safari 3.0+

HTML

<!-- 类名"Wdate"显示日期小图标-->
<input id="select-time" class="Wdate" />

JavaScript

$("#select-time").click(function () {
      WdatePicker({
          el: this, //点击对象id,一般可省略el lang: 'auto', //语言选择,一般用auto dateFmt: 'yyyy-MM-dd HH:mm:ss', //时间显示格式,年月日 时分秒,年月日就是yyyy-MM-dd minDate: '#F{$dp.$D(\'inputstarttime\')}', //最小日期 maxDate: '%y-%M-%d', //最大日期(当前时间) readOnly: true, //是否只读 isShowClear: true, //是否显示“清空”按钮 isShowOK: true, //是否显示“确定”按钮 isShowToday: true, //是否显示“今天”按钮 autoPickDate: true //为false时 点日期的时候不自动输入,而是要通过确定才能输入,为true时 即点击日期即可返回日期值,为null时(推荐使用) 如果有时间置为false 否则置为true }) })

一个时间段选择的栗子:后面的日期不能小于前面的日期 

HTML

<input id="select-start-time" class="Wdate" /> 至 <input id="select-end-time" class="Wdate" />

JavaScript

$("#select-start-time").click(function () {
        WdatePicker({
            lang: 'auto', dateFmt: 'yyyy-MM-dd', maxDate: '#F{$dp.$D(\'select-end-time\')||\'%y-%M-%d\'}', readOnly: true }) }) $("#select-end-time").click(function () { WdatePicker({ lang: 'auto', dateFmt: 'yyyy-MM-dd', minDate: '#F{$dp.$D(\'select-start-time\')}', maxDate: '%y-%M-%d', readOnly: true }) })

 或

							<div class="form-group row">
								<label class="col-sm-2 col-md-2 col-lg-2 col-xl-2 control-label font-normal align-right">开始时间:</label> <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> <input type="input" class="Wdate form-control" id="log-modal-start-time" style="height: 34px; background-color: #ffffff;" name="logModalStartTime" onClick="WdatePicker({maxDate:'#F{$dp.$D(\'log-modal-end-time\')}'});" readonly="readonly" /> </div> <label class="col-sm-2 col-md-2 col-lg-2 col-xl-2 control-label font-normal align-right" style="width: 130px;">结束时间:</label> <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> <input type="input" class="Wdate form-control" id="log-modal-end-time" style="height: 34px; background-color: #ffffff;" name="logModalEndTime" onClick="WdatePicker({minDate:'#F{$dp.$D(\'log-modal-start-time\')}'}); " readonly="readonly" /> </div> </div>

猜你喜欢

转载自www.cnblogs.com/samve/p/12331814.html