【问题标题】:jQuery UI Slider with control buttons?带有控制按钮的 jQuery UI 滑块?
【发布时间】:2012-01-06 10:44:21
【问题描述】:

我正在尝试在 jQuery UI 滑块上添加控制按钮,但无法正常工作。

谁能看到我在这里做错了什么:

$(function() {

    var gmin = 1;
    var gmax = 500;

    $( "#slider" ).slider({
        value:5,
        min: gmin,
        max: gmax,
        step: 1,
        slide: function( event, ui ) {
            $( "#donate_amount_label span" ).html( "£" + ui.value );
        }
    });

    $( "#donate_amount_label span" ).html( "£" + $( "#slider" ).slider( "value" ) );
    $( "#" ).val( $( "#slider" ).slider( "value" ) );

    $('#down').click(function() {

      var s = $("#slider");
      s.slider('value', s.slider('value') + s.slider( "step" ) );   

    });

});

滑块工作正常并且值得到更新,但是当您单击#down 链接时,滚动条没有任何反应。单击#down 链接时,我希望它上移一步。

谢谢 皮特

【问题讨论】:

    标签: jquery jquery-ui controls scrollbar jquery-ui-slider


    【解决方案1】:

    你应该这样做:

    var s =  $( "#slider" ).slider({
        value:5,
        min: gmin,
        max: gmax,
        step: 1,
        slide: function( event, ui ) {
            $( "#donate_amount_label span" ).html( "£" + ui.value );
        }
    });
    
    $('#down').click(function() {
      s.slider('value', s.slider('value') + s.slider( "option", "step" ) );   
    
    });
    

    错误在于获取步骤。你必须使用

     s.slider( "option", "step" ) 
    

    在这里拉小提琴http://jsfiddle.net/nrNX8/(步长为 1 时它移动得非常慢)

    【讨论】:

    • 如果按住鼠标按钮,有没有办法修改它以保持滚动?
    • 在您的示例中,幻灯片事件似乎没有使用 #down 触发
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-03-10
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多