Jquery UI Slider - 基本示例不起作用答案

【问题标题】：Jquery UI Slider - basic example not workingJquery UI Slider - 基本示例不起作用
【发布时间】：2023-03-06 13:57:01
【问题描述】：

以下使用 CSS 和 javascript 的 CDN 的简单 jquery 滑块网页 - 显示滑块但不操作（不随着鼠标单击而步进）。有什么想法吗？

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>

        <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" />

    </head>

    <script src="http://code.jquery.com/jquery.min.js" type="text/javascript"></script>
    <script src="http://code.jquery.com/ui/1.8.19/jquery-ui.min.js" type="text/javascript"></script>

    <body>
        <form id="form1" runat="server">
        <div>

            <script>
                $(function () {
                    $("#slider").slider();
                });
            </script>

            <div id="slider"></div>

        </div>
        </form>
    </body>
    </html>

【问题讨论】：

标签： jquery jquery-ui slider jquery-ui-slider

【解决方案1】：

更新您的 jQuery UI CDN 路径

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js" type="text/javascript"></script>

【讨论】：

【解决方案2】：

使用下面的代码就可以了。

      < 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.7.2/jquery.min.js"></script>
      < script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

【讨论】：