jQWidgets jqxSlider disable()方法

当使用jQWidgets库的jqxSlider控件时，可以通过调用其disable()方法来禁用该控件，以防止用户交互。

disable()方法的基本语法

调用jqxSlider控件的disable()方法，只需在控件实例对象后加上.disable()即可，例如：

$('#jqxslider').jqxSlider().disable();

disable()方法的参数

jqxSlider控件的disable()方法不接受任何参数。

disable()方法的返回值

调用jqxSlider控件的disable()方法后，该控件会被禁用，但该方法没有任何返回值。

示例1：禁用单个jqxSlider控件

以下示例演示如何禁用单个jqxSlider控件：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Disable jqxSlider</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqxwidgets/5.6.0/jqx.base.css" type="text/css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqxwidgets/5.6.0/jqxcore.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqxwidgets/5.6.0/jqxslider.js"></script>
    <script>
        $(document).ready(function () {
            // 创建一个 jqxSlider 示例
            $('#jqxslider').jqxSlider({ min: 0, max: 100, value: 50, step: 1 });

            // 禁用 jqxSlider 控件
            $('#disableSliderBtn').click(function () {
                $('#jqxslider').jqxSlider().disable();
            });
        });
    </script>
</head>
<body>
    // 创建一个 jqxSlider 控件 div 容器
    <div id="jqxslider"></div>
    <br />
    // 创建一个禁用控件按钮
    <button id="disableSliderBtn">Disable jqxSlider</button>
</body>
</html>

示例2：禁用多个jqxSlider控件

以下示例演示如何禁用多个jqxSlider控件：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Disable jqxSlider</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqxwidgets/5.6.0/jqx.base.css" type="text/css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqxwidgets/5.6.0/jqxcore.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqxwidgets/5.6.0/jqxslider.js"></script>
    <script>
        $(document).ready(function () {
            // 创建3个 jqxSlider 示例
            $('#jqxslider1').jqxSlider({ min: 0, max: 100, value: 50, step: 1 });
            $('#jqxslider2').jqxSlider({ min: 0, max: 100, value: 50, step: 1 });
            $('#jqxslider3').jqxSlider({ min: 0, max: 100, value: 50, step: 1 });

            // 禁用所有 jqxSlider 控件
            $('#disableAllSliderBtn').click(function () {
                $('#jqxslider1, #jqxslider2, #jqxslider3').jqxSlider().disable();
            });
        });
    </script>
</head>
<body>
    // 创建3个 jqxSlider 控件 div 容器
    <div id="jqxslider1"></div>
    <br />
    <div id="jqxslider2"></div>
    <br />
    <div id="jqxslider3"></div>
    <br />
    // 创建一个禁用所有 jqxSlider 控件的按钮
    <button id="disableAllSliderBtn">Disable All jqxSlider</button>
</body>
</html>

本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：jQWidgets jqxSlider disable()方法 - Python技术站