jquery - JQuery UI Slider 在它更新的文本框被更改后不工作。(ASP.Net)

Question

我有一个测试 ASP.Net 页面，其中有一个文本框和一个滑块：

<table> 
    <tr>
        <td>Total Monthly Expenses</td>
        <td><asp:TextBox runat="server" ID="txtExpenses" Columns="6" Text="$20" /></td>
        <td align="center"> <div id="sliExpenses" class="slider" /></td> 
    </tr> 
</table>

我已经初始化了头部的滑块：

  <script>
      $(function () {
          $("#sliExpenses").slider({
            animate: true
            , min: 10 
            , max: 100 
            , step: 10
            , value: $("#txtExpenses").val().replace("$", "").replace(",", "")
            , change: function (event, ui) {
                $("#txtExpenses").attr('value', "$" + ui.value);
            }
          });
      });
  </script>

当页面首次加载时，滑块工作正常。你移动它，文本框就会更新。如果我更改文本框中的值，然后尝试使用滑块，滑块将不再更新文本框中的值。我试过滑动、更改和停止功能，它们都有同样的问题。

Answer 1

这是一个工作演示的小提琴：http: //jsfiddle.net/Y7CwL/

您应该使用 .val() 函数设置文本框的值

$("#txtExpenses").val("$" + ui.value);