FireFox兼容js日历插件，支持时间选择

79 浏览量更新于2024-08-30 收藏 89KB PDF 举报

身份认证购VIP最低享 7 折!

30元优惠券

"这篇资源是关于一个兼容Firefox浏览器的JavaScript日历组件的代码实现，它支持获取日期和时间。作者在代码中定义了各种变量和函数，如`cal`、`isFocus`、`pickMode`等，以及用于选择日期的`SelectDateById`和`SelectDate`函数。该日历组件考虑了日期选择的精度，可以从秒、分钟、小时、日期、月份到年份进行选择。此外，还有自定义定位偏移量的设置，以增强用户体验。" 在这个JavaScript日历组件中，有几个关键点值得关注： 1. **变量定义**：`cal`用于存储日历实例，`isFocus`标记日历是否获得焦点，`pickMode`是一个对象，用于表示不同的日期选择模式，从秒到年，用数字1到6表示。 2. **选择日期的函数**：`SelectDateById`函数接收一个ID，用于根据ID获取元素并选择日期。这个函数首先获取指定ID的元素，然后调用其`focus()`方法使其获得焦点，接着尝试模拟点击事件。如果元素有`onclick`或`click`属性，则执行相应的事件处理函数，否则调用`SelectDate`函数。 3. `SelectDate`函数负责实际的日历显示和定位。它接收元素、日期格式、自定义的x和y坐标作为参数。如果元素已存在，会初始化或更新日历实例`cal`，并设置日期选择的精度。日期范围设定为当前日期的50年前至50年后。 4. **自定义定位**：`topY`和`leftX`变量用于存储自定义的定位偏移量，允许用户调整日历弹出的位置。 5. **日期精度**：通过检查日期格式`strFormat`，日历组件可以自动调整到合适的精度。例如，如果没有's'字符，精度会默认设置为分钟。这个JavaScript日历组件的代码设计考虑了浏览器兼容性，特别是针对Firefox，同时提供了灵活的配置选项，如日期选择精度和自定义位置，适合在网页应用中集成以提供日期和时间的选择功能。通过这样的组件，开发者可以方便地在前端实现用户友好的日期输入和选择功能。

资源详情

资源推荐

兼容兼容FireFox 的的 js 日历日历支持时间的获取支持时间的获取

代码如下:

var cal;

var isFocus=false; //是否为焦点

var pickMode ={

“second”:1,

“minute”:2,

“hour”:3,

“day”:4,

“month”:5,

“year”:6 };

var topY=0,leftX=0; //自定义定位偏移量 2007-02-11 由寒羽枫添加

//选择日期 → 由寒羽枫 2007-06-10 添加，通过 ID 来选日期

function SelectDateById(id,strFormat,x,y)

{

var obj = document.getElementById(id);

if(obj == null){return false;}

obj.focus();

if(obj.onclick != null){obj.onclick();}

else if(obj.click != null){obj.click();}

else{SelectDate(obj,strFormat,x,y)}

}

//选择日期 → 由寒羽枫 2006-06-25 添加

function SelectDate(obj,strFormat,x,y)

{

leftX =(x == null) ? leftX : x;

topY =(y == null) ? topY : y;//自定义定位偏移量 2007-02-11 由寒羽枫添加

if(document.getElementById(“ContainerPanel”)==null){InitContainerPanel();}

var date = new Date();

var by = date.getFullYear()-50; //最小值 → 50 年前

var ey = date.getFullYear()+50; //最大值 → 50 年后

//cal = new Calendar(by, ey,1,strFormat); //初始化英文版，0 为中文版

cal = (cal==null) ? new Calendar(by, ey, 0) : cal; //不用每次都初始化 2006-12-03 修正

cal.DateMode =pickMode[“second”]; //复位

if(strFormat.indexOf(‘s’)< 0) {cal.DateMode =pickMode[“minute”];}//精度为分

if(strFormat.indexOf(‘m’)< 0) {cal.DateMode =pickMode[“hour”];}//精度为时

if(strFormat.indexOf(‘h’)< 0) {cal.DateMode =pickMode[“day”];}//精度为日

if(strFormat.indexOf(‘d’)< 0) {cal.DateMode =pickMode[“month”];}//精度为月

if(strFormat.indexOf(‘M’)< 0) {cal.DateMode =pickMode[“year”];}//精度为年

if(strFormat.indexOf(‘y’)< 0) {cal.DateMode =pickMode[“second”];}//默认精度为秒

cal.dateFormatStyleOld = cal.dateFormatStyle;

cal.dateFormatStyle = strFormat;

cal.show(obj);

}

/**//**//**//**//**//**//**//**

* 返回日期

* @param d the delimiter

* @param p the pattern of your date

2006-06-25 由寒羽枫修改为根据用户指定的 style 来确定；

String.prototype.toDate = function(style) {

var y = this.substring(style.indexOf(‘y’),style.lastIndexOf(‘y’)+1);//年

var M = this.substring(style.indexOf(‘M’),style.lastIndexOf(‘M’)+1);//月

var d = this.substring(style.indexOf(‘d’),style.lastIndexOf(‘d’)+1);//日

var h = this.substring(style.indexOf(‘h’),style.lastIndexOf(‘h’)+1);//时

var m = this.substring(style.indexOf(‘m’),style.lastIndexOf(‘m’)+1);//分

var s = this.substring(style.indexOf(‘s’),style.lastIndexOf(‘s’)+1);//秒

if(s == null ||s == “” || isNaN(s)) {s = new Date().getSeconds();}

if(m == null ||m == “” || isNaN(m)) {m = new Date().getMinutes();}

if(h == null ||h == “” || isNaN(h)) {h = new Date().getHours();}

if(d == null ||d == “” || isNaN(d)) {d = new Date().getDate();}

if(M == null ||M == “” || isNaN(M)) {M = new Date().getMonth()+1;}

if(y == null ||y == “” || isNaN(y)) {y = new Date().getFullYear();}

var dt ;

eval (“dt = new Date(‘”+ y+”‘, ‘”+(M-1)+”‘,'”+ d+”‘,'”+ h+”‘,'”+ m+”‘,'”+ s +”‘)”);

return dt;

下载后可阅读完整内容，剩余9页未读，立即下载

weixin_38608688

粉丝: 3
资源: 934

FireFox兼容js日历插件，支持时间选择

js日历 兼容firefox

JS火狐兼容日历控件

JS日历控件 (兼容IE firefox) 可选择时间

zoom 兼容 firefox

selenium自动化firefox不兼容

js获取上传图片全路径，支持ie，firefox

页面缩放兼容性处理方法(zoom,firefox火狐浏览器)

谷歌js获取当前计算机用户,JS获取当前浏览器（Chrome，Firefox）

firefox45.3esr

firefox 53.8 esr

js querySelector火狐無法兼容

html怎么设置火狐谷歌兼容模式,Firefox和Chrome之间的CSS兼容性

requestAnimationFrame 兼容谷歌 火狐

firefox.exe

创建Firefox浏览器对象使用的webdriver.Firefox(executable_path=driver_path, firefox_options=firefox_options)其中参数含义

firefox不能看bilibili

selenium-java使用firefox获取网页的例子

安装了Firefox ActiveX Plugin但浏览器还显示没有这个插件，是为什么

element.clientWidth兼容火狐浏览器写法

svg图表兼容火狐浏览器

最新资源

js日历兼容firefox

requestAnimationFrame 兼容谷歌火狐