1、本次介绍一个好用的 多日期选择插件：EasyUI date，适用于：需要一次性选择多个日期，无需手动一个一个进行添加。

2、效果图：

3、下载地址：http://www.jeasyui.com/download/index.php

4、汉化：建议在使用页面：

<script type="text/javascript" src="你的网站绝对地址/locale/easyui-lang-zh_CN.js"></script>

5、使用Demo：可参考http://www.jeasyui.com/demo/main/index.php?plugin=Calendar&theme=default&dir=ltr&pitem=Basic&sort=

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>Basic Calendar - jQuery EasyUI Demo</title>

    <link rel="stylesheet" type="text/css" href="/Public/plugins/easyui/themes/default/easyui.css">

    <link rel="stylesheet" type="text/css" href="/Public/plugins/easyui/themes/icon.css">

    <link rel="stylesheet" type="text/css" href="/Public/plugins/easyui/demo/demo.css">

    <script type="text/javascript" src="/Public/plugins/easyui/jquery.min.js"></script>

    <script type="text/javascript" src="/Public/plugins/easyui/jquery.easyui.min.js"></script>

</head>

<body>

    <h2>Basic Calendar</h2>

    <p>Click to select date.</p>

    <div style="margin:20px 0"></div>

    <div class="easyui-calendar" style="width:250px;height:250px;display:none;position: absolute;z-index: 999;margin-top: 22px;"></div>

    <input type="text" name="ftsj" value="" id="ftsj">

</body>

<script type="text/javascript">

$(function(){

    $("#ftsj").focus(function(){

        $(".easyui-calendar").css("display","");

    });

    $(document).on("click",".calendar-day",function(){

        var date = $(this).attr("abbr");

        var date2 = date.replace(/,/g,"-");

        console.log("点击的日期=="+date2);

        //若需要进行存储，这里执行ajax 即可。

    })

})

</script>

</html>

6、注：如果和你页面样式有冲突，请去掉上面demo的demo.css

【jquery】多日期选择插件easyui date的更多相关文章

  1. 移动设备日期选择插件（基于JQUERY）

    上周花了2个小时写的一个日期选择插件,比较适合移动端的设备.先看个效果图吧.如果刚好是你需要的就往下吧,不需要的也可以继续..... 其实网络上已经有的了类似的成熟插件,比如基于mobiscroll, ...

  2. EasyUI 日期选择插件封装成选择到月份的插件

    将普通的日期选择插件封装成选择到月份的插件:                     var nowMonth = new Date();                    var month = ...

  3. 贴近用户体验的jQuery日期选择插件

    分享一款贴近用户体验的jQuery日期选择插件.这是一款双日历jQuery日期选择时间插件pickerDateRange.效果图如下: 在线预览   源码下载 var dateRange = new ...

  4. 纯原生js移动端日期选择插件

    最近在项目上需要使用日期选择插件,由于是移动端的项目,对请求资源还是蛮节约的,可是百度上一搜,诶~全是基于jquery.zepto的,本来类库就很大,特别像mobiscroll这种样式文件一大堆又丑又 ...

  5. angular2+ 引用layDate日期选择插件

    layDate日期选择插件使用npm安装好像是行不通的,但angular2+的日期选择控件库又不能够支持时分秒的选择 在angular项目中引用layDate 1. 首先官网下载layDate独立版, ...

  6. 基于jquery的城市选择插件

    城市选择插件的难度不是很大,主要是对dom节点的操作.而我写的这个插件相对功能比较简答,没有加入省市联动. 上代码好了,参照代码的注释应该比较好理解. /* *基于jquery的城市选择插件 *aut ...

  7. 推荐三款日期选择插件(My97DatePicker+jquery.datepicker+Mobiscroll)

    1.My97DatePicker 纯原生JS,专注于PC端,支持IE6+:页面上只需要引入WdatePicker.js文件,但是My97DatePicker整个目录是一个整体,最好不要破坏里面的目录结 ...

  8. 打造基于jQuery的日期选择控件

    终于把jQuery拼写正确了哈,哈哈javascript也是区分大小写的,所以确实不能写错,今天我来和大家分享的是日期选择控件的实现,功能也许不够强大,但是能够满足需求. 我之前也写过(正确的说是改过 ...

  9. HTML5 input date属性引起的探索——My97DatePicker（日期选择插件）

    不得不说H5的input date属性真的好用,之前我写的http://www.cnblogs.com/tu-0718/p/6729274.html这篇博客里面也有提到,不过虽然移动端对H5的支持还是 ...

随机推荐

  1. 【deep learning学习笔记】注释yusugomori的DA代码 --- dA.cpp -- 模型测试

    测试代码.能看到,训练的时候是单个样本.单个样本的训练的,在NN中是属于“stochastic gradient descent”,否则,一批样本在一起的,就是“standard gradient d ...

  2. High Availability (HA) 和 Disaster Recovery (DR) 的区别

    High availability 和disaster recovery不是一回事. 尽管在规划和解决方案上有重叠的部分, 它们俩都是business contiunity的子集. HA的目的是在主数 ...

  3. ASP.NET 网站管理工具介绍

    有没有感觉对 web.config 的操作很烦呢? 老是手动来编辑 web.config 确实挺麻烦的, 不过自 ASP.NET 2.0 起便有了 ASP.NET 网站管理工具, 这个工具呢,其实就是 ...

  4. .Net(c#)打印--多页打印

    如果要实现多页打印,就要使用PrintPageEventArgs类的HasMorePages属性. 我们对之前的代码作如下变更:      增加PrintDocument的BeginPrint和End ...

  5. java 反射机制--根据属性名获取属性值

    1.考虑安全访问范围内的属性,没有权限访问到的属性不读取 /** * 根据属性名获取属性值 * * @param fieldName * @param object * @return */ priv ...

  6. C#与Visual Basic的异与同

    C#是一种高级程序设计语言,是一种安全.稳定.简单.优雅的编程语言,它与Visual Basic有很多相同的地方,同时也有很多不同的地方.我们今天这篇博客本着学习C#的原则,着重介绍一下C#与Visu ...

  7. Android -- Exif

    Exif Exif是一种图像文件格式,它的数据存储于JPEG格式是完全相同的,实际上Exif格式就是JPEG格式头插入了数码照片的信息,包括拍摄的光圈.快门.平衡白.ISO.焦距.日期时间等各种和拍摄 ...

  8. Java 解决 servlet 接收参数中文乱码问题

    方法一: 接收到的参数进行如下操作[不建议]: String tmp = new String(type.getBytes("iso-8859-1"), "utf-8&q ...

  9. ASP入门（七）-Response小案例

    我们通过ASP来创建一个年月日的选择框,年份从1950到2000年,如果手动输入HTML代码,其中的<option>列表项目要写94个 (51年 + 12月 + 31天),很是繁琐. 代码 ...

  10. maven 下载源码downloadsources

    mvn eclipse:eclipse -Ddownloadsources=true  -Ddownloadjavadocs=true