將jQuery滑塊的初始值設置為0

Question

下面的代碼創建了一個jQuery滑塊，可在我的Python / Django調查網站中使用。 問題是初始值設置不正確。

value: 0似乎只是在加載頁面時控制滑塊的位置，實際上在加載頁面時$("#slider-result")沒有顯示任何值。 這應該顯示為0。

因此，如果value: 0沒有將初始值設置為0 ，我該怎么做？

問題是，如果用戶在不移動滑塊的情況下提交survyform，則不會記錄任何值，甚至不會記錄為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>

Answer 1

您必須在頁面加載時設置該值，該設置適用於滑塊本身而不是元​​素，並且如果未在任何地方聲明它將沒有任何值。 在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>

Answer 2

問題是未為隱藏的表單字段實現 defaultValue。 因此，您有兩種解決方法。

1. 就像朱利安（Julien）所說的那樣，使用javascript設置頁面加載的值。
2. 使用值為0且CSS設置為dispaly的文本輸入字段：無