使用简单的javascript/jQuery UI元素

我没有使用jQuery或Javascript的经验，所以我在文件中学习了这一点。我必须在.ASCX页面中放置一个滑块。这是该.ascx文件中代码的一部分：

<tr>
    <td style="width: 140px; height: 25px;"><asp:Label ID="lblHeader" runat="server" CssClass="InputHeader" meta:resourcekey="lblHeader" /></td>
    <td><asp:Label ID="lblSliderLeft" runat="server" Text="L" CssClass="sliderLabelLeft" />
        <input type="range" name="slider1" id="slider1" style="width:210px" value="1" min="0" max="1" step="1" />
        <asp:Label ID="lblSliderRight" runat="server" Text="R" CssClass="sliderLabelRight" />
    </td>
    <td></td>
</tr>

在页面顶部，我包括以下内容：

<!-- Load jQuery and jQuery UI -->
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<!-- Load the jQuery UI CSS -->
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
</body>

---

现在我的问题是，如何使用这个滑块？如何从.cs文件中的函数设置其值？如何在.cs文件中获取它的值？

这里有一个JSFIDLE可以回答您的问题

50
//当浏览器准备就绪时。。。
$（函数（）{
//创建一个新的jQuery UI滑块元素
//并设置一些默认参数。
$（“#滑块”）.滑块({
射程：“分钟”，
价值：50，
分:0,，
最高：100，
幻灯片：功能（事件、用户界面）{
//滑动时，更新#amount div元素中的值
var value=$（“#slider”）。slider（“value”）；//您可以在任何地方使用value
$（“#金额”）。文本（值）；
$（“金额”）.css（“字体大小”，值）；
}
});
值=$（“#滑块”）。滑块（“值”）；
$（“#金额”）。文本（值）；
$（“金额”）.css（“字体大小”，值）；
});

是否存在任何控制台错误？使用IE上的开发工具，当我转到页面时，控制台上没有错误。@特斯拉在您的评论之后，滑块，它是否仅在IE或其他浏览器上工作？在ok中似乎正常。我更新了问题。我采取了不同的方法，让它出现了。现在我的问题是一个基本的javascript问题。如何使用此滑块？

<tr>
    <td style="width: 140px; height: 25px;"><asp:Label ID="lblHeader" runat="server" CssClass="InputHeader" meta:resourcekey="lblHeader" /></td>
    <td><asp:Label ID="lblLeft" runat="server" Text="L" CssClass="sliderLabelLeft" />
        <div id="slider" style="margin-top:100px;"></div>
        <asp:Label ID="lblRight" runat="server" Text="R" CssClass="sliderLabelRight" />
    </td>
    <td><div id="amount" style="padding: 10px; border: 3px solid silver; text-align:center;">50</div></td>
</tr>



// When the browser is ready...
$(function () {
    // Create a new jQuery UI Slider element
    // and set some default parameters.
    $("#slider").slider({
        range: "min",
        value: 50,
        min: 0,
        max: 100,
        slide: function (event, ui) {
            // While sliding, update the value in the #amount div element
            var value = $("#slider").slider("value"); // You can use value anywhere
            $("#amount").text(value);
            $("#amount").css("font-size", value);
        }
    });
    value = $("#slider").slider("value");
    $("#amount").text(value);
    $("#amount").css("font-size", value);
});