如何为显示jquery滑块值的文本框设置默认值

How can I set a default value to a textbox that displays my jquery slider value

本文关键字:文本 设置 默认值 显示 jquery      更新时间:2023-09-26

我有一个jquery滑块,最小值为1,最大值为400。当我移动滑块时,相应的值会显示在文本框中。然而,我想在页面上显示最小值。请在文本框和滑块上加载,我该如何实现这一点?这是我的滑动码

/*slider begin*/
    $("#slider").slider({
        value:1,
        max:400,
        min:1,
        /*
         change:function(event,ui){
                     $("input#amt").val(ui.value)
                 }
         */
        slide: function(event, ui) {   $("#amt").val(ui.value) }
    });
     $("#amt").change(function(event) {
   var data = $("#amt").val();
   if (data.length > 0) 
   {
      if (parseInt(data) >= 0 && parseInt(data) <= 400) 
      {
          $("#slider").slider("option", "value", data);
      }
      else
      {
        if (parseInt(data) < 0) 
        {
          $("#amt").val("0");
          $("#slider").slider("option", "value", "0");
        }
        if (parseInt(data) > 400) 
        {
          $("#amt").val("400");
          $("#slider").slider("option", "value", "400");
        }
     }
   }
    else
    { 
      $("#slider").slider("option", "value", "1"); 
    }   
   });
    /*slider end*/

您可以首先设置滑块值:

$("#slider").slider( "value" , 1);

然后读取它以设置文本框值(或者只将文本框值设置为-1,但不太好看)

$("#amt").val($("#slider").slider( "value"));

您的滑块应按原样设置为1-滑块的值选项执行以下操作。来自API:

如果只有一个控制柄,则确定滑块的值。如果有多个控制柄,则确定第一个控制柄的值。

代码示例

使用指定的值选项初始化滑块。

$( ".selector" ).slider({ value: 37 });

您可以按如下方式设置文本框的值:

$("#amt").val(1);