為什么滑塊在jquery中不起作用？

Question

您能告訴我為什么滑塊在jquery中不起作用嗎？ 我看到了這個演示，但是回調函數不會觸發？ 為什么呢？

我從此網址獲得幫助http://rangeslider.js.org/

這是我的代碼

<!DOCTYPE html>
<html>

<head>
    <script data-require="jquery@*" data-semver="3.1.1" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
</head>

<body>
    <h1>Hello Plunker!</h1>
    <input type="range" min="10"
           max="1000"
           step="10"
           value="300" />
    <script>
        $(function () {
            console.log('====')
            $('input[type="range"]').rangeslider({
                // Feature detection the default is `true`.
                // Set this to `false` if you want to use
                // the polyfill also in Browsers which support
                // the native <input type="range"> element.
                polyfill: true,

                // Callback function
                onInit: function () {
                    console.log('init')
                },

                // Callback function
                onSlide: function (position, value) { },

                // Callback function
                onSlideEnd: function (position, value) {
                    console.log(value)
                }
            });
        })
    </script>
</body>
</html>

這是我的代碼https://plnkr.co/edit/cbh60dJcvHhAoqDlLo9g?p=preview

回調函數為什么不觸發？ 當我滑動滑塊時

Answer 1

從您的示例中尚不清楚您是否要為Range Slider加載JS和CSS文件，因此這可能是問題的一部分。

另外，如果您希望默認顯示它，則需要將polyfill: true,更改為polyfill: false, 。

 $(function () { $('input[type="range"]').rangeslider({ polyfill: false, onInit: function() { console.log('init') }, // Callback function onSlide: function(position, value) {}, // Callback function onSlideEnd: function(position, value) { console.log(value) } }); })

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/rangeslider.js/2.3.2/rangeslider.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/rangeslider.js/2.3.2/rangeslider.min.css"> <h1>Hello Plunker!</h1> <input type="range" min="10" max="1000" step="10" value="300" />

為什么滑塊在jquery中不起作用？

問題描述

1 個解決方案

解決方案1
0 2018-01-25 11:35:26

為什么滑塊在jquery中不起作用？

問題描述

1 個解決方案

解決方案1 0 2018-01-25 11:35:26

解決方案1
0 2018-01-25 11:35:26