jQueryUI滑块拖动日期范围选择器

jQueryUI滑块拖动日期范围选择器

selectToUISlider日期时间器,通过jquery ui滑块slider制作一个日期进度条拖动效果,拖动的范围结果显示在上方的下拉框。

淘建站为您提供更多_日期时间_年月时间段_日期_范围,在此特别感谢您对我们的支持与厚爱!

查看演示

演示不了,点击反馈

加入收藏

下载 375 次

下载资源

67 积分

特别说明:本站资源来自网友发布分享,仅供学习与参考,请勿用于商业用途,若有侵权请联系删除(272966172@qq.com)。

开始日期

<label for="valueA">Start Date:</label>
<select name="valueA" id="valueA">
    <optgroup label="2003">
        <option value="01/03">Jan 03</option>
        <option value="02/03">Feb 03</option>

        <option value="03/03">Mar 03</option>
        <option value="03/03">Apr 03</option>
        <option value="03/03">May 03</option>
        <option value="06/03">Jun 03</option>
        <option value="07/03">Jul 03</option>
        <option value="08/03" selected="selected">Aug 03</option>

        <option value="09/03">Sep 03</option>
        <option value="10/03">Oct 03</option>
        <option value="11/03">Nov 03</option>
        <option value="12/03">Dec 03</option>
    </optgroup>
</select>

结束日期

<label for="valueB">End Date:</label>

引入selectToUISlider日期范围插件

<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.7.1.custom.min.js"></script>
<script type="text/javascript" src="js/selectToUISlider.jQuery.js"></script>

<link rel="stylesheet" href="css/jquery-ui-1.7.1.custom.css" type="text/css" />
<link rel="Stylesheet" href="css/ui.slider.extras.css" type="text/css" />
$('select').selectToUISlider({
    labels: 12, //设置标签的显示个数  
    sliderOptions: {
        change: function(e, ui) { //定义change事件  

        }
    }
});

声明:本资料由淘建站会员提供,如转载注明来源,资料来源淘建站免费素材库:https://www.taojz.cn/texiao/832.html
jQueryUI滑块拖动日期范围选择器 希望对你有帮助,感谢您的支持!
  • jquery粉红色带提示的日期日历插件

    jquery粉红色带提示的日期日历插件

  • HTML5结合jQuery实现图片滑块特效

    HTML5结合jQuery实现图片滑块特效

  • jquery带滑块的网站下拉导航菜单代码

    jquery带滑块的网站下拉导航菜单代码

  • js css3圆形时钟带星期和日期时钟代码

    js css3圆形时钟带星期和日期时钟代码

  • jQuery适用于手机端酒店入住日期选择代码

    jQuery适用于手机端酒店入住日期选择代码

  • jQuery手机网页年月日期选择插件

    jQuery手机网页年月日期选择插件

  • jQuery日期选择器插件自定义多种日期选择

    jQuery日期选择器插件自定义多种日期选择

  • jquery.datePicker日期选择器text文本框弹出日历

    jquery.datePicker日期选择器text文本框弹出日历

  • jquery select框应用jquery ui滑块slide

    jquery select框应用jquery ui滑块slide

  • jquery鼠标拖动滑块选取数值代码

    jquery鼠标拖动滑块选取数值代码

  • JQuery ui日期控件支持时分秒日期选择器代码

    JQuery ui日期控件支持时分秒日期选择器代码

  • jquery rangeslider范围选择

    jquery rangeslider范围选择

  • 留言(0)
    头像
     阿里云限量代金券,戳我领取
    1 2