Question

在下面的jquery UI滑块的简单示例中，我无法弄清楚我的错误。有人能发现问题吗？

<!DOCTYPE html>
<html>
<head>
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

    <style type="text/css">
        #slider01 { margin: 10px; }

    </style>

    <script>
        $(document).ready( function() {

            var valmin = valmax = 0;

            $("#slider01").slider({
                min: 0, 
                max: 9, 
                slide: function (event, ui) {

                    $('#val01').val($(this).slider('value'));

                }
            });                     
        });
    </script>
</head>

<body style="font-size:62.5%;">  

    <div id="slider01"></div>
    <input type="text" id="val01"/>

</body>
</html>

有人能发现问题吗？

Answer 1

使用传递给幻灯片事件的ui var。

var valmin = valmax = 0;

$("#slider01").slider({
    min: 0,
    max: 9,
    range: true,
    values: [0, 9],
    slide: function(event, ui) {
        $('#val01').val(ui.values[0]+', '+ui.values[1]);
    }
});

http://jsfiddle.net/petersendidit/wxLez/

jquery ui滑块不能反映正确的值？

1 个答案: