2017-06-30 73 views
0

我有一个简单的自举timepicker。与timepicker我连接三个单选按钮:Bootstrap timepicker - 点击更改minutestep

<div class="checkbox"> 
    <label><input id="customTimeslot" type="radio" name="autoTimeslot" value="custom" checked="checked"> Use custom</label><br> 
    <label><input id="autoHalfHourTimeslot" type="radio" name="autoTimeslot" value="half_hour"> Generate half hour slot</label><br> 
    <label><input id="autoTimeslot" type="radio" name="autoTimeslot" valu> Generate one hour slot</label> 
</div> 

在我的自定义JavaScript文件,我有这样的设置:

$('.timepicker').timepicker({ 
    'showMeridian': false, 
    'showInputs': false, 
    'minuteStep': 15 
}); 

而且我不会是,如果半小时单选按钮被选中,minuteStep应设置为30。

所以,我虽然这将工作:

$("#autoHalfHourTimeslot").change(function(){ 
    if(this.checked) { 
     $('.timepicker').timepicker({ 
      'showMeridian': false, 
      'showInputs': false, 
      'minuteStep': 30 
     }); 
    } 
}); 

如何有史以来,只有当我删除最初的代码时,minuteSteps总是增加15,然后它将应用那30分钟的步骤。但是如果没有点击单选按钮,我需要15分钟的步骤。感谢您的帮助。

回答

0

这个问题的解决方案是添加了另一个人之前删除时间选择器的当前设置。所以,我创建了一个节选的是分步功能,删除当前timepicker和初始化另一个与传递minutestep参数:

function initializeTimepicker(minuteStep) { 
    if (document.readyState === 'complete') { 
     $('.timepicker').timepicker('remove'); 
    } 
    $('.timepicker').timepicker({ 
     'showMeridian': false, 
     'showInputs': false, 
     'minuteStep': minuteStep 
    }); 
} 
0

尝试点击功能

$("#autoHalfHourTimeslot").click(function(){ 
+0

不,我进入的是$(“#autoHalfHourTimeslot”)变化(函数(){。所以这不是问题,出于某种原因,它不会将新设置添加到时间选择器 – Milo

0

我认为你必须写一个脚本,同时在电台点击和您必须根据无线电改变事件指派minuteStep。

$(document).ready(function() { 
    $('input[type=radio][name=autoTimeslot]').change(function() { 
    { 
     ..... 
    } 
} 

请检查下面的链接,我认为这将帮助你 How to use radio on change event?

+0

我做到了,但仍然不会改变它的价值。 – Milo