jQuery UI设置固定日期选择特效代码分享


Posted in Javascript onAugust 27, 2015

本文实例讲述了jQuery UI设置固定日期选择特效。分享给大家供大家参考。具体如下:
jQuery实现UI设置固定日期选择特效是一款jQuery ui日期插件,可选固定日期及自定义日期代码。
运行效果图:                             -------------------查看效果 下载源码-------------------

jQuery UI设置固定日期选择特效代码分享

小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式。
为大家分享的jQuery UI设置固定日期选择代码如下

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
<title>jQuery UI设置固定日期选择代码</title>

<link rel="stylesheet" href="css/jquery-ui-1.9.2.custom.css" type="text/css">

<script type="text/javascript" src="js/jquery-1.8.3.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.9.2.custom.js"></script>
<script type="text/javascript" src="js/share.js"></script>

</head>
<body>

<input type="text" class="ui-datepicker-time" readonly value="" />

<div class="ui-datepicker-css"> 
  <div class="ui-datepicker-quick">
    <p>快捷日期<a class="ui-close-date">X</a></p>
    <div>
      <input class="ui-date-quick-button" type="button" value="今天" alt="0" name=""/>
      <input class="ui-date-quick-button" type="button" value="昨天" alt="-1" name=""/>
      <input class="ui-date-quick-button" type="button" value="7天内" alt="-6" name=""/>
      <input class="ui-date-quick-button" type="button" value="14天内" alt="-13" name=""/>
      <input class="ui-date-quick-button" type="button" value="30天内" alt="-29" name=""/>
      <input class="ui-date-quick-button" type="button" value="60天内" alt="-59" name=""/>
    </div>
  </div>
  <div class="ui-datepicker-choose">
    <p>自选日期</p>
    <div class="ui-datepicker-date">
      <input name="startDate" id="startDate" class="startDate" readonly value="2014/12/20" type="text">
      -
      <input name="endDate" id="endDate" class="endDate" readonly value="2014/12/20" type="text" disabled onChange="datePickers()">
    
    </div>
  </div>
</div>

<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>适用浏览器:360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下浏览器。</p>
</div>
</body>
</html>

以上就是为大家分享的jQuery UI设置固定日期选择代码,希望大家可以喜欢。

Javascript 相关文章推荐
js前台判断开始时间是否小于结束时间
Feb 23 Javascript
基于jQuery的倒计时实现代码
May 30 Javascript
js nextSibling属性和previousSibling属性概述及使用注意
Feb 16 Javascript
js调用打印机打印网页字体总是缩小一号的解决方法
Jan 24 Javascript
AngularJS基础学习笔记之指令
May 10 Javascript
基于JavaScript实现轮播图代码
Jul 14 Javascript
JS实现获取来自百度,Google,soso,sogou关键词的方法
Dec 21 Javascript
详解angularJS自定义指令间的相互交互
Jul 05 Javascript
关于axios不能使用Vue.use()浅析
Jan 12 Javascript
Vue2.0点击切换类名改变样式的方法
Aug 22 Javascript
分享5个小技巧让你写出更好的 JavaScript 条件语句
Oct 20 Javascript
vue 页面回退mounted函数不执行的解决方案
Jul 26 Javascript
js实现的早期滑动门菜单效果代码
Aug 27 #Javascript
jQuery实现自动与手动切换的滚动新闻特效代码分享
Aug 27 #Javascript
js实现向右横向滑出的二级菜单效果
Aug 27 #Javascript
jQuery实现输入框下拉列表树插件特效代码分享
Aug 27 #Javascript
javascript中html字符串转化为jquery dom对象的方法
Aug 27 #Javascript
javascript 动态修改css样式方法汇总(四种方法)
Aug 27 #Javascript
JavaScript实现带箭头标识的多级下拉菜单效果
Aug 27 #Javascript
You might like
ThinkPHP中Session用法详解
2014/11/29 PHP
CI框架AR操作(数组形式)实现插入多条sql数据的方法
2016/05/18 PHP
js下获取div中的数据的原理分析
2010/04/07 Javascript
jquery ajax abort()的使用方法
2010/10/28 Javascript
浅析js中2个等号与3个等号的区别
2013/08/06 Javascript
基于javascript实现图片预加载
2016/01/05 Javascript
Bootstrap入门书籍之(四)菜单、按钮及导航
2016/02/17 Javascript
全面解析Bootstrap中tooltip、popover的使用方法
2016/06/13 Javascript
jQuery实现页面下拉100像素出现悬浮窗口的方法
2016/09/05 Javascript
vue2.0中goods选购栏滚动算法的实现代码
2017/05/17 Javascript
jQuery回调方法使用示例
2017/06/26 jQuery
angularJs-$http实现百度搜索时的动态下拉框示例
2018/02/27 Javascript
如何在vue中使用ts的示例代码
2018/02/28 Javascript
Node Mongoose用法详解【Mongoose使用、Schema、对象、model文档等】
2020/05/13 Javascript
Vue-CLI 3 scp2自动部署项目至服务器的方法
2020/07/24 Javascript
JavaScript setTimeout()基本用法有哪些
2020/11/04 Javascript
Python后台开发Django的教程详解(启动)
2019/04/08 Python
pandas计数 value_counts()的使用
2019/06/24 Python
Python Process多进程实现过程
2019/10/22 Python
python pip安装包出现:Failed building wheel for xxx错误的解决
2019/12/25 Python
python3 Scrapy爬虫框架ip代理配置的方法
2020/01/17 Python
Django如何在不停机的情况下创建索引
2020/08/02 Python
小女主人连衣裙:Little Mistress
2017/07/10 全球购物
泰国网上购物:Shopee泰国
2018/09/14 全球购物
语文教育专业推荐信范文
2013/11/25 职场文书
一名老师的自我评价
2014/02/07 职场文书
小小的船教学反思
2014/02/21 职场文书
公司节能减排方案
2014/05/16 职场文书
大学生求职信例文
2014/06/29 职场文书
求职信的正确写法
2014/07/10 职场文书
学校禁毒宣传活动总结
2015/05/08 职场文书
培训后的感想
2015/08/07 职场文书
MySQL时间设置注意事项的深入总结
2021/05/06 MySQL
Python使用OpenCV和K-Means聚类对毕业照进行图像分割
2021/06/11 Python
Java数据结构之链表相关知识总结
2021/06/18 Java/Android
关于python爬虫应用urllib库作用分析
2021/09/04 Python