HTML部分 <li> <label class="label"><span class="star">*</span>生日:</label> <select class="sel_year"> </select>年 <select class="sel_month"> </select>月 <select class="sel_day"> </select>日 </li> 使用方法: <script type="text/javascript"> $(function () { // 出生年月插件 $.ms_DatePicker({ YearSelector: ".sel_year", MonthSelector: ".sel_month", DaySelector: ".sel_day" }); }); </script> 插件代码: (function($){ $.extend({ ms_DatePicker: function (options) { var defaults = { YearSelector: "#sel_year", MonthSelector: "#sel_month", DaySelector: "#sel_day", FirstText: "--", FirstValue: 0 }; var opts = $.extend({}, defaults, options); var $YearSelector = $(opts.YearSelector); var $MonthSelector = $(opts.MonthSelector); var $DaySelector = $(opts.DaySelector); var FirstText = opts.FirstText; var FirstValue = opts.FirstValue; // 初始化 var str = "<option value=\"" + FirstValue + "\">" + FirstText + "</option>"; $YearSelector.html(str); $MonthSelector.html(str); $DaySelector.html(str); // 年份列表 var yearNow = new Date().getFullYear(); for (var i = yearNow; i >= 1900; i--) { var yearStr = "<option value=\"" + i + "\">" + i + "</option>"; $YearSelector.append(yearStr); } // 月份列表 for (var i = 1; i <= 12; i++) { var monthStr = "<option value=\"" + i + "\">" + i + "</option>"; $MonthSelector.append(monthStr); } // 日列表(仅当选择了年月) function BuildDay() { if ($YearSelector.val() == 0 || $MonthSelector.val() == 0) { // 未选择年份或者月份 $DaySelector.html(str); } else { $DaySelector.html(str); var year = parseInt($YearSelector.val()); var month = parseInt($MonthSelector.val()); var dayCount = 0; switch (month) { case 1: case 3: case 5: case 7: case 8: case 10: case 12: dayCount = 31; break; case 4: case 6: case 9: case 11: dayCount = 30; break; case 2: dayCount = 28; if ((year % 4 == 0) && (year % 100 != 0) || (year % 400 == 0)) { dayCount = 29; } break; default: break; } for (var i = 1; i <= dayCount; i++) { var dayStr = "<option value=\"" + i + "\">" + i + "</option>"; $DaySelector.append(dayStr); } } } $MonthSelector.change(function () { BuildDay(); }); $YearSelector.change(function () { BuildDay(); }); } // End ms_DatePicker }); })(jQuery);
相关推荐
这个插件允许用户方便地选择日期,甚至可以扩展到选择时间,实现年月日时分秒的精确选取。 Datepicker插件的核心功能是显示一个可交互的日历,用户可以通过点击或输入来选择日期。在基本用法中,你可以通过简单的...
《jQuery手机端出生年月日选择代码:打造高效触屏日期选择体验》 在移动互联网时代,优化用户体验成为了开发者的重要任务。特别是在填写表单时,用户需要输入出生年月日等日期信息,传统的方式可能在手机小屏幕上...
jQuery插件:警告-确认-提示弹出对话框效果_jquery_alert_dialogsjQuery插件:警告-确认-提示弹出对话框效果_jquery_alert_dialogsjQuery插件:警告-确认-提示弹出对话框效果_jquery_alert_dialogs
**jQuery 插件:Ajax 和 Iframe 加载提示效果** 在网页开发中,用户体验是至关重要的,尤其是在进行异步操作(如Ajax请求)或加载Iframe时,用户往往需要一个明确的反馈,告知他们系统正在进行后台处理。这个jQuery...
为了使用这个插件,你可以在jQuery的选择器之后调用`notification`方法,传入所需的参数: ```javascript $('.your-selector').notification({ message: '操作成功!', type: 'success', duration: 5000 }); ```...
"jQuery移动端出生年月日选择插件"正是为此目的而设计的工具,它能够提供一个直观且易于操作的日期选择界面,使得用户在移动端填写表单时更加便捷。 这个插件基于jQuery库,jQuery是广泛使用的JavaScript库,简化了...
"jQuery多功能年月日星期时间特效插件"是一个专门为jQuery设计的日期和时间处理工具,它提供了一套直观、易于操作的时间选择界面,可以实现日期的显示、选择、格式化等多种功能。该插件旨在增强用户体验,简化开发者...
jQuery 年月日插件适用于需要日期选择功能的各种 Web 应用,如表单填写、预订系统等。由于基于 jQuery,它在主流浏览器上具有良好的兼容性,包括 Chrome、Firefox、Safari、Edge 和旧版本的 Internet Explorer。 ...
在这个场景中,jQuery被用来创建年月选择器,因为它提供了方便的API和丰富的插件生态系统。 2. **日期选择器插件**:jQuery有许多第三方插件,如DatePicker、DateTimePicker等,用于实现各种日期选择功能。对于“只...
该插件的下载文件为"jquery出生信息年月日选择插件timeData下载.zip",内含必要的CSS样式和JavaScript脚本文件,以及可能的示例代码或文档,方便开发者快速集成到项目中。 在使用"timeData"插件前,确保您的项目...
DatePicker还可以与其他jQuery UI组件结合使用,如时间选择器TimePicker Addon,以实现日期和时间的联合选择。此外,可以利用API实现更复杂的功能,如限制可选日期范围、禁用特定日期等。 总结,jQuery UI的...
而"jQuery插件颜色选择器"是jQuery生态中的一款实用工具,用于帮助用户在网页上方便地选取颜色。这类插件通常提供一个交互式的颜色面板,允许用户通过鼠标点击或滑动来选择所需的颜色值,适用于各种需要颜色输入的...
来自James Smith (http://loopj.com)一个JQuery 插件 我对该插件进行了加强化 可以看我的博客 http://hi.baidu.com/hjzheng/blog/item/afc83748d77aaae183025c6d.html
例如,使用jQuery选择器可以轻松地选取页面中的特定元素,而$.fn.extend()方法则允许我们创建自定义的jQuery插件。 这个"可拖动的图片展示实例"插件是jQuery功能的一个典型应用,它利用了JavaScript的拖放API来实现...
jQuery日期时间选择器插件.rar jQuery日期时间选择器插件.rar jQuery日期时间选择器插件.rar jQuery日期时间选择器插件.rar jQuery日期时间选择器插件.rar jQuery日期时间选择器插件.rar jQuery日期时间选择器插件....
**jQuery日期选择器插件**是一种广泛应用于网页开发中的组件,它允许用户通过交互式的日历界面方便地选择日期。这种插件极大地提高了用户在网页上输入日期的体验,尤其适用于需要用户输入生日、预约日期或者截止日期...
jquery插件库大全(200个): jqueryQQ表情插件 jquery下拉菜单导航 jquery下拉菜单栏 jquery仿Windows系统选中图标效果 jquery仿京东商品详情页图片放大效果 jquery仿百度新闻焦点轮播 jquery分离布局模版 jquery...
针对“只选择年月”的需求,这里介绍的是一款名为“simpleCanleder”的jQuery插件,它专门设计用于让用户仅能选择年份和月份,而非完整的日期。以下是对这款插件的详细解析: 1. **使用场景**: - 当用户只需要...
**颜色选择器 - JQUERY插件** 在网页设计和开发中,颜色选择器是一个不可或缺的工具,它允许用户在界面上方便地选取所需的颜色。JQUERY插件中的颜色选择器是一个简洁而功能强大的组件,旨在增强用户体验,使颜色...
总的来说,“jQuery日历插件可选年月(中文)”是一个方便且功能强大的工具,它可以为你的网页应用添加专业的日期选择功能,同时适应中文环境。通过理解和利用它的特性,你可以轻松地提升你的项目用户体验。