手机端H5周历组件

作者 : 开心源码 本文共689个字,预计阅读时间需要2分钟 发布时间: 2022-05-11 共126人阅读

本篇主要是带大家入门周历组件的用,该文档后面会持续优化升级。若有不足,请大家多多指教,作者会及时更正!

实例展现

手机端H5周历组件

  • 周历示例演示,支持上一周、下一周切换等效果 注:按F12可在浏览器预览

典型项目应使用案例

  • 【移动OA类】 我的日志

依赖资源

  • libs/calendar_base_week.js 周历组件基类js库

配置和用方法

DOM结构

一个div就可

手机端H5周历组件

初始化

以下代码是最简单的使用法

手机端H5周历组件

参数说明

参数参数类型说明
containerstring或者HTMLElement必选 Calendar容器的css选择器,例如“#calendar”。默认为#calendar
prestring或者HTMLElement可选 前一周按钮的css选择器或者HTML元素。默认.pre
nextstring或者HTMLElement可选后一周按钮的css选择器或者HTML元素。默认.next
dataRequestFunction可选 回调函数,绑定业务数据。例如:某天有日程,则会在对应日期上标识出一个小红点或者者其余标识,默认传入数据格式:data=[{"date":"2018-04-18"},{"date":"2018-04-17"},{"date":"2018-04-16"}]
onItemClickFunction必选 回调函数,当你点击或者轻触某日期 300ms后执行。回调日期结果:2018-04-07
templateFunction或者String可选,元素渲染的模板,能是一个模板字符串,也能是一个函数,为函数时,确保返回模板字符串,默认组件内置模板
isDebugBoolean可选能否开启调试模式,默认false
说明
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是摆设,本站源码仅提供给会员学习使用!
7. 如遇到加密压缩包,请使用360解压,如遇到无法解压的请联系管理员
开心源码网 » 手机端H5周历组件

发表回复