zoukankan      html  css  js  c++  java
  • bootstrap datetimepicker的一些小总结

    关于日历控件我真的就是一直就研究。我分享我自己遇到的几个问题

    1.点击日历 比如 这种情况 间距的高度小于日历的高度,那我们应该让日历直接显示在左上方

    解决办法:修改插件库

    var一个当前文本的一个高度再判断如果页面的高度减去当前页面点击的高度小于日历的高度 就让top值等于当前页面点击的高度减去日历的高度

    效果如下 

    2.箭头显示

    解决办法:在配置里面加 bootcssVer: 3 值得一试~

    3.出现1899这个问题

    解决办法:出现这个问题一般都是自己的配置没有写对

    建议对比官网

    4.可以选择秒

    我们需要修改源文件

    1)、this.picker.find('.datetimepicker-minutes td').html(html.join('')); 把这句话改为

    var addSec = /,s{1,2},/.test(',' + this.format.parts.join(',') + ','), sSec = addSec ? '<select style="100%">' : '';
    this.addSec = addSec;
    if (addSec) {
    var orgSec = this.viewDate.getSeconds();
    for (var _i = 0; _i < 60; _i++) sSec += '<option value="' + _i + '"' + (_i == orgSec ? ' selected' : '') + '>' + (_i < 10 ? '0' : '') + _i + '</option>';
    sSec += '</select>';
    }
    this.picker.find('.datetimepicker-minutes td').html(html.join('') + sSec);

    2)在点击事件这里添加这句话

     if (e.target.tagName == 'SELECT' || e.target.tagName == 'OPTION') return;

    3)找到case 'span' 修改秒针的获取方式

    改成 seconds =  this.addSec ? this.picker.find('select').val() : this.viewDate.getUTCSeconds();

  • 相关阅读:
    PAT 甲级 1041 Be Unique (20 分)(简单,一遍过)
    [精]Odoo 8.0深入浅出开发教程-模块开发基础
    iOS开发- UILabel 自己主动换行 及 高度自适应
    Android
    权限管理表结构设计
    创建SQL语句_面试
    Hasen的linux设备驱动开发学习之旅--时钟
    关于源程序到可运行程序的过程
    微信服务号 微信支付开发
    MongoDB基础入门视频教程
  • 原文地址:https://www.cnblogs.com/khun/p/8600882.html
Copyright © 2011-2022 走看看