当前位置 : 主页 > 网页制作 > JQuery >

jquery-ui – jquery ui slider,如果满足某些条件则停止滑动

来源:互联网 收集:自由互联 发布时间:2021-06-15
使用jQuery UI Slider,我试图弄清楚如何使滑块在满足某些条件后停止工作.有任何想法吗?我认为在“开始”部分停止事件传播会起作用,但是……事实并非如此.所以我仍然无能为力,迷失方
使用jQuery UI Slider,我试图弄清楚如何使滑块在满足某些条件后停止工作.有任何想法吗?我认为在“开始”部分停止事件传播会起作用,但是……事实并非如此.所以我仍然无能为力,迷失方向.

<script type="text/javascript">
    $(document).ready(function () {
        var spendable = 1000;
        var spent = 0;

        function spend(quantity) {

            var remaining = spendable - quantity;
            $('#spendable').text(remaining);
        }

        $("#eq .slider").each(function () {
            var current = 0;
            $(this).slider({
                range: "min",
                step: 100,
                value: 0,
                min: 0,
                max: 500,
                animate: true,
                orientation: "horizontal",
                start: function (event, ui) {
                    if (spent < spendable)
                        return true;
                    event.stopPropagation();
                },
                slide: function (event, ui) {
                    // set the current value to whatever is selected.
                    current = ui.value;
                    $(this).parent('div:eq(0)').find('.spent').text(current);

                    var totalled = 0;
                    $("#eq .slider").each(function () {
                        totalled += parseInt($(this).parent('div:eq(0)').find('.spent').text());
                        spend(totalled);
                    });
                }
            });
        });
尝试:

…..

slide: function (event, ui) {
                    // set the current value to whatever is selected.
                    current = ui.value;
                    if(current > 300){
                       current = 300; //otherwise, it's stuck at 301
                       return false;
                     }

                   ....rest of your code
网友评论