jquery.range.js jQuery左右滑动范围选择器插件-BFW插件库

jquery.range.js jQuery左右滑动范围选择器插件

第一步引入bfwone

第二步执行插件

示例如下

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>BFW NEW PAGE</title>
    <script id="bfwone" data="dep=jquery.17&err=0" type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/bfwone.js"></script>
    <script type="text/javascript">
        bready(function() {
            use(["jquery.range", "jquery.range"], function() {
                $('.single-slider').jRange({

                    from: 0,

                    to: 100,

                    step: 1,

                    scale: [0, 25, 50, 75, 100],

                    format: '%s',

                    width: 300,

                    showLabels: true,

                    showScale: true

                });

                $('.range-slider').jRange({

                    from: 0,

                    to: 100,

                    step: 1,

                    scale: [0, 25, 50, 75, 100],

                    format: '%s',

                    width: 300,

                    showLabels: true,

                    isRange: true

                });



                $("#g1").click(function() {

                    var aa = $(".single-slider").val();

                    alert(aa);

                });

                $("#g2").click(function() {

                    var aa = $(".range-slider").val();

                    alert(aa);

                });


            });
        });
    </script>
    <style type="text/css">

        .demo {
            width: 350px;
            margin: 100px auto 10px auto
        }

        #g1,#g2 {
            margin-top: 50px
        }

    </style>
</head>
<body style="padding:20px;background:white;">
    <div class="demo">
        <input type="hidden" class="single-slider" value="23" />
        <button id="g1">获取值</button>
    </div>
    <div class="demo">
        <input class="range-slider" type="hidden" value="25,75" />
        <button id="g2">获取值</button>
    </div>
</body>
</html>

jquery.range.js jQuery左右滑动范围选择器插件

网友评论0

colpick.js

jcdate.js

laydate.js

PCASClass.js

distpicker.js

mPicker.js

calendar.js

jquery.range.js

Mdate.js

dateRange.js