2013-10-10 4 views
0

15 분 단위로 시간을 선택할 수있는 jquery 슬라이더가 있습니다. 슬라이딩 할 때 15 분에서 1 시간으로 이동해야하며 8 시간까지 계속해야합니다. 나는 성공 사례가없는 온라인에서 많은 예제를 시도했다. 지금 내 슬라이더는 단지 15 분의 int 증분에서 480 분까지갑니다. 어떤 도움이나 아이디어라도 감사 할 것입니다. 미리 감사드립니다.Jquery Slider. 슬라이더를 사용하여 15 분 단위로 표시하고 분 단위가 아닌 시간을 표시하십시오.

소스 코드

<script type="text/javascript" language="javascript"> 
    $(document).ready(function() { 
     $("#slider-range-max").slider({ 
      range: "min", 
      min: 0, 
      max: 480, 
      value: 15, 
      step: 15, 
      slide: function (event, ui) { 
       $("#amount").val(ui.value); 
       $("#amount1").val(ui.value); 
      } 
     }); 
     if("<%=this.IsPostBack%>" === "True") 
     { 
      $("#amount").val($("#slider-range-max").slider("value")); 
      $("#amount1").val($("#slider-range-max").slider("value")); 
      $("#txtHiddenAmount").val($("#amount").val()); 
     } 

    }); 

    <label for="amount">Time/Length in Minutes(Slide to Desired Amount, 1 Credit per hour):</label> 
       &nbsp 
       <input type="text" id="amount1" readonly="readonly" style="border: 0; color: #f6931f; font-weight: bold;" /> 
       <asp:TextBox ID="amount" runat="server" Style="color: white"  BorderWidth="0" ClientIDMode="Static">15</asp:TextBox> 

답변

1

당신이 시간과 분에 분의 값의 형식을 필요로하는 경우 다만이 같은 계산을 수행 할 수 있습니다

var hours = Math.floor(val/60); 
var minutes = val % 60; 

바이올린 예 : http://jsfiddle.net/9vPrW/2/

+0

덕분에 마법처럼 일했다! 신속하고 도움이되는 응답에 감사드립니다. – user2425793

0

변경 6015에서 step 값 각 1 시간 단위로 시간을 증가 슬라이더를 초기화하는 동안.
또한, 시간 값을 표시하려면 60

예에 의해 분 값을 분할해야합니다 : .val(parseInt($("#slider-range-max").slider("value"))/60);