首页 > 软件开发 > JQUERY >

如何用jquery插件实现生日日期选择

来源:互联网 2023-03-17 00:52:17 259

项目用户管理模块用到和生日选择下拉框,该插件是在原有基础之上修改而来的,基本功能没有什么大的改变,只是做了些本土化的修改,另外,稍微扩展了一下,当然如果功能不满足你的要求,你也可以尽情的扩展。

oGM办公区 - 实用经验教程分享!

oGM办公区 - 实用经验教程分享!

工具/原料

  • 原js下载地址:http://abecoffman.com/stuff/birthdaypicker修改后:http://note.youdao.com/share/?id=fa4c8352d24f6d9f0bcc5c0650554612&type=note/

属性、用法介绍

  • 1

    调用方法

    oGM办公区 - 实用经验教程分享!

    oGM办公区 - 实用经验教程分享!

    如何用jquery插件实现生日日期选择oGM办公区 - 实用经验教程分享!

  • 2

    maxAge : 设置“年”下拉表中年的个数,这里设置为10则显示最近10年的(前提是你开始“年”必须为今年2013),默认值为120。

    oGM办公区 - 实用经验教程分享!

    oGM办公区 - 实用经验教程分享!

    如何用jquery插件实现生日日期选择oGM办公区 - 实用经验教程分享!

  • 3

    minAge : 与maxAge相对,如果当前年为2013年,并且设置了minAge为20,那么最早可以选择的年限为1993年。

    oGM办公区 - 实用经验教程分享!

    oGM办公区 - 实用经验教程分享!

  • 3该信息未经许可获取自百度经验
  • 4

    maxYear : 年列表中最大年,你可用一个具体年如,'2013-07-06'或者采用变量获取当前年的字符串。oGM办公区 - 实用经验教程分享!

    默认值为todayYear(算法:todayDate = new Date(), todayYear = todayDate.getFullYear())oGM办公区 - 实用经验教程分享!

    oGM办公区 - 实用经验教程分享!

    oGM办公区 - 实用经验教程分享!

  • 5

    futureDates : 将来(未来)时间是否可以选择,例如:你在maxYear设置为'2020',并且futureDates为true,此时列表内容为:

    oGM办公区 - 实用经验教程分享!

    oGM办公区 - 实用经验教程分享!

    如何用jquery插件实现生日日期选择oGM办公区 - 实用经验教程分享!

  • 6

    futureDates为false时:

    oGM办公区 - 实用经验教程分享!

    oGM办公区 - 实用经验教程分享!

    如何用jquery插件实现生日日期选择oGM办公区 - 实用经验教程分享!

  • 7

    dateFormat:在这里format指的是显示年月日的顺序,bigEndian: “年月日” ,littleEndian:“日月年”,否则 “月日年”

    oGM办公区 - 实用经验教程分享!

    oGM办公区 - 实用经验教程分享!

  • 8

    monthFormat:其实没有什么大用途,之前因为是英文版本的,short为英文版单词缩写。

    oGM办公区 - 实用经验教程分享!

    oGM办公区 - 实用经验教程分享!

  • 9

    placeholder: 是否显示默认提示的信息。

    oGM办公区 - 实用经验教程分享!

    oGM办公区 - 实用经验教程分享!

    如何用jquery插件实现生日日期选择oGM办公区 - 实用经验教程分享!

  • 10

    defaultDate : 元素初始时的值

    oGM办公区 - 实用经验教程分享!

    oGM办公区 - 实用经验教程分享!

    如何用jquery插件实现生日日期选择oGM办公区 - 实用经验教程分享!

  • 11

    hiddenDate:是否要添加一个时间隐藏域,值为true或false 默认为trueoGM办公区 - 实用经验教程分享!

    fieldName:隐藏域元素的name值 默认为:birthdateoGM办公区 - 实用经验教程分享!

    fieldId:隐藏域元素的id值 默认为:birthdateoGM办公区 - 实用经验教程分享!

    oGM办公区 - 实用经验教程分享!

    oGM办公区 - 实用经验教程分享!

    如何用jquery插件实现生日日期选择oGM办公区 - 实用经验教程分享!

  • 12

    wraper:为盛放select元素的容器,这个是我自己扩展的,原来插件只支持fieldset,修改后可以有多种方式选择。效果如下:oGM办公区 - 实用经验教程分享!

    "wraper":"span"oGM办公区 - 实用经验教程分享!

    如何用jquery插件实现生日日期选择oGM办公区 - 实用经验教程分享!

  • 13

    legend:fieldset下元素属性

    oGM办公区 - 实用经验教程分享!

    oGM办公区 - 实用经验教程分享!

    如何用jquery插件实现生日日期选择oGM办公区 - 实用经验教程分享!

  • 以上方法由办公区教程网编辑摘抄自百度经验可供大家参考!oGM办公区 - 实用经验教程分享!


    标签: JQUERY

    办公区 Copyright © 2016-2023 www.bgqu.net. Some Rights Reserved. 备案号:湘ICP备2020019561号统计代码