js 日期插件 datepicker

Posted 哦先生

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js 日期插件 datepicker相关的知识,希望对你有一定的参考价值。

点击图片出现  时间 ,增加一个点击事件

 1 <label for="" class="width80">创建日:</label>
 2                         <div class="input-group">
 3                             <div class="date">
 4                                 <?= html::TextInput(‘search[begin_date]‘,
 5                                     isset($searchParams[‘begin_date‘]) ? $searchParams[‘begin_date‘] : ‘‘,
 6                                     [‘id‘ => ‘begin_date‘, ‘class‘ => ‘form-control border0 border-radius0‘, ‘style‘ => "width: 115px;"])
 7                                 ?>
 8                             </div>
 9                             <div class="input-group-addon white border0 border-radius0">
10                                     <i class="iconfont">&#xe674;</i>
11                             </div>
12                         </div>

引入

<?php $this->registerCssFile(‘@web/assets/datepicker/css/bootstrap-datepicker3.min.css‘, [‘position‘ => View::POS_BEGIN]) ?>
<?php $this->registerJsFile(‘@web/assets/datepicker/js/bootstrap-datepicker.min.js‘, [‘position‘ => View::POS_BEGIN]) ?>
<?php $this->registerJsFile(‘@web/assets/datepicker/locales/bootstrap-datepicker.zh-CN.min.js‘, [‘position‘ => View::POS_BEGIN]) ?>

 

1 $("#begin_date").datepicker({
2             format: ‘yyyy-mm-dd‘,
3             language: ‘zh-CN‘,
4             autoclose: true,
5         }).on(‘show‘, function () {
6             var $datepick = $(".datepicker");
7             var bottom = $datepick.position().bottom;
8         });

 

增加点击事件

1 /* datepicker bind icon show*/
2 $(function(){
3     $(".input-group-addon").click(function(){
4         $(this).prev().find("input").focus();
5     })
6 });

 

以上是关于js 日期插件 datepicker的主要内容,如果未能解决你的问题,请参考以下文章

js 日期插件 datepicker

My97DatePicker日历插件

如何从我的 DatePicker 片段中传输格式化的日期字符串?

jsp日期插件My97DatePicker

当同时使用bootstrap-datepicker.js和jquery.validate.js这两款插件,至少要选择两次时间,才能验证成功的问题

datePicker.js 应用