设置jQuery滑动条的初始值为0

Setting the initial value of a jQuery slider bar to 0

本文关键字：jQuery 设置      更新时间：2023-09-26

下面的代码创建了一个jQuery滑块，我在我的Python/Django调查网站中使用它。问题是初始值没有被正确设置。

value: 0似乎只是在加载页面时控制滑块的位置，实际上在加载页面时$("#slider-result")中没有显示任何值。这应该显示一个0。

如果value: 0没有将初始值设置为0，我该怎么做?

问题是，如果用户提交的调查表没有移动滑块，那么没有值，甚至没有一个0被记录。

slider_two.js 

$('#submit').click(function() {
    var username = $('#hidden').val();
    if (username == "") username = 0;  
    $.post('comment.php', {
        hidden: username
    }, function(return_data) {
        alert(return_data);
    });
});
$(".slider").slider({
    animate: true,
    range: "min",
    value: 0,
    min: -100,
    max: +100,
    step: 1,

//This updates the slider-result below the slider bar so the participant can see the rating they give
    slide: function(event, ui) { 
      $("#slider-result").html((ui.value > 0 ? '+' : '') + ui.value);

//This updates the hidden form field so I can submit the data using a form
      if($(this).attr("id") ==  "one")
          $("#hidden1").val((ui.value > 0 ? '+' : '') + ui.value);
    }
});
<标题>编辑

我直接将建议的解决方案添加到我的模板中，就在slider-result之上，但它似乎没有什么不同。我错过什么了吗?

删除历史记录并强制所有文件使用Command Shift R重新加载

感谢
<script>
    ($function(){
        $("#slider-result").html('0');
        $("#hidden1").val('0');
    });
</script>


<div id="slider-result"></div>                                  
<input type="hidden" name="slider_value" id="hidden1"/>     
          <script src="/static/survey/js/slider_two.js"></script>
</div>

你必须在页面加载时设置值，该设置适用于滑动条本身而不是元素，如果它没有在任何地方声明，它将没有任何值。在jquery中:

($function(){
    $("#slider-result").html('0');
    $("#hidden1").val('0');
});

或者事件最好直接放在模板中，这样客户端就不用处理了:

<div id="slider-result">0</div>                                  
<input type="hidden" name="slider_value" id="hidden1" value="0"/>     
          <script src="/static/survey/js/slider_two.js"></script>
</div>

问题是defaultValue 未实现用于隐藏表单字段。所以你有两个选择来解决这个问题。

  1. 使用javascript设置页面加载值，就像Julien上面说的。
  2. 使用value=0的文本输入字段，CSS设置为显示:none
相关文章：