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 相关文章推荐
Javascript学习笔记 delete运算符
Sep 13 Javascript
jquery禁止回车触发表单提交
Dec 12 Javascript
node.js中的fs.appendFile方法使用说明
Dec 17 Javascript
使用JS画图之点、线、面
Jan 12 Javascript
jQuery调用ajax请求的常见方法汇总
Mar 24 Javascript
XML文件转化成NSData对象的方法
Aug 12 Javascript
AngularJs ng-route路由详解及实例代码
Sep 14 Javascript
Three.js利用dat.GUI如何简化试验流程详解
Sep 26 Javascript
详解从0开始搭建微信小程序(前后端)的全过程
Apr 15 Javascript
详解 微信小程序开发框架(MINA)
May 17 Javascript
微信小程序保持session会话的方法
Mar 20 Javascript
基于react项目打包css引用路径错误解决方案
Oct 28 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 防止表单重复提交的方法
2011/08/08 PHP
php的ZipArchive类用法实例
2014/10/20 PHP
服务器上配置PHP运行环境教程
2015/02/12 PHP
Yii2压缩PHP中模板代码的输出问题
2018/08/28 PHP
laravel5使用freetds连接sql server的方法
2018/12/07 PHP
改写一个简单的菜单 弹性大小
2010/12/02 Javascript
解决ueditor jquery javascript 取值问题
2014/12/30 Javascript
javascript背景时钟实现方法
2015/06/18 Javascript
Nodejs 发送Post请求功能(发短信验证码例子)
2017/02/09 NodeJs
js实现分页功能
2017/05/24 Javascript
移动端触摸滑动插件swiper使用方法详解
2017/08/11 Javascript
详解Vue.js组件可复用性的混合(mixin)方式和自定义指令
2017/09/06 Javascript
Node.js自定义实现文件路由功能
2017/09/22 Javascript
面包屑导航详解
2017/12/07 Javascript
Vue中使用vue-i18插件实现多语言切换功能
2018/04/25 Javascript
Element UI框架中巧用树选择器的实现
2018/12/12 Javascript
node.js express捕获全局异常的三种方法实例分析
2019/12/27 Javascript
javascript实现图片轮换动作方法
2020/08/07 Javascript
Vue2.0 ES6语法降级ES5的操作
2020/10/30 Javascript
[01:04:29]DOTA2-DPC中国联赛 正赛 Phoenix vs XG BO3 第二场 1月31日
2021/03/11 DOTA
Python 含参构造函数实例详解
2017/05/25 Python
详解python的webrtc库实现语音端点检测
2017/05/31 Python
python实现判断一个字符串是否是合法IP地址的示例
2018/06/04 Python
元组列表字典(莫烦python基础)
2019/04/03 Python
PYQT5设置textEdit自动滚屏的方法
2019/06/14 Python
用html5的canvas画布绘制贝塞尔曲线完整代码
2013/08/14 HTML / CSS
澳大利亚当地社区首选的光学商店:1001 Optical
2019/08/24 全球购物
妇女儿童发展规划实施方案
2014/03/16 职场文书
小班评语大全
2014/05/04 职场文书
经济贸易专业自荐信
2014/06/11 职场文书
机电专业毕业生自我鉴定2014
2014/10/04 职场文书
离婚协议书标准格式
2014/10/04 职场文书
2014年人事专员工作总结
2014/11/19 职场文书
python将图片转为矢量图的方法步骤
2021/03/30 Python
MySQL安装后默认自带数据库的作用详解
2021/04/27 MySQL
python实现进度条的多种实现
2021/04/29 Python