`
ansonlh
  • 浏览: 37205 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
文章分类
社区版块
存档分类

轻松使用JQuery的日历,一段JS代码让项目文本框调出日历

阅读更多
继续回馈ITEYE, 绝对原创,轻松使用JQuery的日历,一段JS代码让项目文本框调出日历
调用说明:
1. 需要引用jJQuery库;
2. 给需要调用日历的文本框控件加上css id:JQueryDatePicker, 你的css样式文件中没有定义也能正确运行。
<asp:TextBox ID="txtDate" runat="server" Width="100px" CssClass="JQueryDatePicker" />

<input type="text" id="hidUserId" runat="server" value="" class="JQueryDatePicker" />



JS代码:

$(document).ready(function () {

   $('.JQueryDatePicker').datepicker({
      showOnFocus: true,
      changeMonth: true,
      changeYear: true,
      showOtherMonths: true,
      selectOtherMonths: true,
      showStatus: true,
      gotoCurrent: true,
      numberOfMonths: 3,
      showCurrentAtPos: 2,
      firstDay: 1,
      //showOn: "both",
      //rangeSelect: true,
      //monthsToShow: 2,
      dateformat: 'yy-mm-dd',
      yearRange: '-10:+1',
      closeText: '关闭',
      prevText: '&#x3c;上月',
      nextText: '下月&#x3e;',
      currentText: '今天',
      dayNamesMin: ["日", "一", "二", "三", "四", "五", "六"],
      monthNames: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"]
   });
});
分享到:
评论

相关推荐

    点击文本框弹出日历的jquery代码和使用方法

    打开这个文件,你会看到一段JavaScript代码,这段代码实现了基本的日历功能,并且可以根据需求进行定制。 要实现点击文本框弹出日历,首先需要在HTML中创建一个文本框,添加一个`id`以便于之后的jQuery选择器使用:...

    jquery的日历控件控件代码

    总结起来,jQuery的日历控件是一个强大的工具,能够为用户提供直观的日期选择体验,而通过jQuery UI Datepicker插件,我们可以轻松实现跨浏览器兼容性,包括对IE和Firefox的支持。通过适当的配置和扩展,可以满足...

    jquery日期日历插件 单击文本框弹出日期选择控件

    而`js`目录则可能包含jQuery库和其他与日历功能相关的JavaScript代码。 在实际应用中,这类插件通常会使用事件监听来响应文本框的点击事件,然后动态创建或显示日历元素。开发者可以通过自定义配置,设置日期格式、...

    JQuery日历代码

    而"JQuery日历代码"通常指的是使用jQuery库来实现的一种交互式日历组件。这种组件常用于网站中展示日期选择器或者日程管理功能。在本案例中,提供的压缩包文件包含了实现这一功能的代码示例。 首先,让我们了解一下...

    简洁的jQuery日历代码.zip

    本资源"简洁的jQuery日历代码"提供了一种实现日历功能的方法,这对于网页开发中的日期选择或者日程管理是非常实用的。下面将详细介绍这个jQuery日历代码的核心知识点。 首先,jQuery日历的基本结构基于HTML、CSS和...

    jQuery文本框创建关键词标签代码

    在本文中,我们将深入探讨如何使用jQuery来创建一个功能丰富的文本框,该文本框能够动态地生成和管理关键词标签。这个功能广泛应用于各种网站,如社交媒体、博客平台、论坛等,帮助用户方便地组织和分类内容。 首先...

    jQuery计算文本框可输入字数代码.zip

    这段代码首先获取了文本框的最大长度,然后定义了一个`updateCount`函数,用于计算当前已输入的字数并更新剩余字数的显示。如果输入字数超过最大限制,`remainingChars`的字体颜色将变为红色,以警告用户。`keyup`...

    JQuery日历控件 .

    通过使用JQuery,开发者可以更轻松地实现复杂的DOM操作,而无需编写大量的原生JavaScript代码。 2. **JQuery UI与日历插件** JQuery日历控件通常是基于JQuery UI库的一个插件。JQuery UI是JQuery的扩展,提供了...

    jQuery移动端日历带事件代码.zip

    "jQuery移动端日历带事件代码"是一个专门针对移动设备设计的日历插件,它不仅包含了基本的日历功能,还提供了农历显示以及与用户事件相结合的功能,如显示当日课表或待办事项列表。下面我们将深入探讨这个日历插件的...

    jquery.datePicker日历控件应用text文本框弹出日历表与默认显示日

    在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了JavaScript代码的编写,使得DOM操作、事件处理和动画变得更加容易。而`jquery.datePicker`是jQuery的一个扩展插件,用于实现日期选择功能,通常与...

    jQuery文本框输入文字自动筛选代码

    这段代码首先获取了文本框和结果列表的jQuery对象,然后在文本框的`keyup`事件上设置了一个处理器。处理函数获取输入的关键词,如果为空则清空列表;否则,遍历列表中的所有`&lt;li&gt;`元素,检查它们的文本是否包含...

    jQuery简单日历每日签到功能代码.zip

    在本项目中,"jQuery简单日历每日签到功能代码.zip" 包含了一个使用jQuery实现的简单日历,该日历支持用户每日签到并显示本月已签到的天数。这个功能对于网站或者应用来说,是一个常见的用户互动元素,可以提升用户...

    一款简单jQuery日历选择器代码

    本篇文章将深入探讨如何使用jQuery创建一个简单日历选择器,以及这个选择器背后的代码原理。 首先,jQuery日历选择器通常用于网页上的日期输入,为用户提供友好的交互体验。用户不再需要手动输入日期,而是通过点击...

    jQuery手机端HTML5带农历日期选择插件jQuery移动端日历插件swiper.js

    js目录则包含了JavaScript源代码,包括jQuery、swiper.js以及自定义的日历插件逻辑。 总的来说,这款jQuery手机端HTML5日历插件充分利用了现有的前端技术,为移动应用开发提供了一个功能齐全、用户体验良好的日期...

    jquery 日历插件源码

    总结来说,jQuery日历插件Calendar是一个功能强大且易于定制的工具,通过`calender.css`、`index.html`和`calender.js`这三个文件,我们可以了解其工作原理,并根据项目需求进行个性化改造。无论你是初学者还是经验...

    js jquery 自动在文本框提示信息

    JavaScript 和 jQuery 是Web开发中广泛使用的两种技术,用于创建交互式的网页动态效果。在这个主题中,我们将深入探讨如何使用 jQuery 来实现文本框中的自动提示信息功能。 首先,`jQuery` 是一个轻量级的 ...

    jQuery文本框输入表情符号代码

    在这个项目中,jQuery将被用来监听文本框的输入事件,并处理表情选择和渲染。 1. **创建界面** - `index.html` 文件是页面的主体,通常包含HTML结构,包括一个文本输入框和表情选择按钮。例如: ```html ...

    jQuery日历组件

    jQuery日历组件是一种常见的网页交互元素,用于展示日期选择功能,常见于事件安排、预订系统或者任何形式需要用户输入日期的应用中。它通过简洁的API和丰富的自定义选项,为开发者提供了一个高效且易于使用的解决...

    经典jquery日历代码

    在本案例中,我们讨论的是一个名为"经典jQuery日历代码"的项目,该代码可能包含了一个功能完善的日历插件实现。 1. **jQuery库**: jQuery是一个轻量级的JavaScript库,它简化了HTML文档遍历、事件处理、动画以及...

Global site tag (gtag.js) - Google Analytics