第一次只有开始和结束时间计算工作 [英] first time only start and end time calculation is working

问题描述

more than a day I hav try to calculate the start and end time difference its i ill be working correctly on first selection. when i select again start time its i ill be not change the end time duration i ill try to solve it i hav no idea what i should hav mistak it can any 1 clear it 

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

  <script type="text/javascript" src="jquery.timepicker.js"></script>
  <link rel="stylesheet" type="text/css" href="jquery.timepicker.css" />

< script type =text / javascript>



$（ function（）{

$（'＃t_start_time'）。timepicker（{

'step'：15

}）;

}）;

//暂时禁用结束时间

$（function（）{

$（＃t_end_time ）.prop（'disabled'，true）;

}）;

//选择开始时间

$（函数（ ）{

$（'＃t_start_time'）。on（'changeTime'，function（）{

//启用结束时间输入

$（'＃t_end_time'）。prop（'禁用'，false）;



//启用作为时间选择器的输入

$（'＃t_end_time'）。timepicker（{

minTime：$（this）.val（），

showDuration：true，

step：15，

className：'endTime'

}）。on（changeTime，function（） {

var selectedDurationSpan = $（。ui-timepicker-wrapper.endTime）。find（li.ui-timepicker-selected）。find（span.ui-timepicker-duration ）;

var selectedDuration = selectedDurationSpan.text（）。trim（）。replace（/ [（）] / g，''）;

$（＃t_duration ）.val（selectedDuration）;

}）;

}）;

}）;



< / script>

<script type="text/javascript" >

$(function() {
$('#t_start_time').timepicker({
'step': 15
});
});
// temporarily disable end time
$(function() {
$("#t_end_time").prop('disabled', true);
});
// when a start time is chosen
$(function() {
$('#t_start_time').on('changeTime', function () {
// enable the end time input
$('#t_end_time').prop('disabled', false);

// enable the input as a timepicker
$('#t_end_time').timepicker({
minTime: $(this).val(),
showDuration: true,
step: 15,
className: 'endTime'
}).on("changeTime", function () {
var selectedDurationSpan = $(".ui-timepicker-wrapper.endTime").find("li.ui-timepicker-selected").find("span.ui-timepicker-duration");
var selectedDuration = selectedDurationSpan.text().trim().replace(/[()]/g, '');
$("#t_duration").val(selectedDuration);
});
});
});

</script>

<div class="form-group">
    <label for="t_start_time"> start time:</label>
    <input type="text" id="t_start_time" name="t_start_time" class="form-control ui-timepicker-input" />
</div>
<div class="form-group" id="end_time">
    <label for="t_end_time"> end time:</label>
    <input type="text" id="t_end_time" name="t_end_time" class="form-control ui-timepicker-duration" />
</div>
<div class="form-group" id="duration">
    <label for="t_duration"> duration:</label>
    <input type="text" id="t_duration" name="t_duration" class="form-control ui-timepicker-duration" disabled="true" />
</div>

推荐答案

（function（）{

(function() {

（'#t_start_time'）。timepicker（{

'step'：15

}）;

}）;

//暂时禁用结束时间

('#t_start_time').timepicker({
'step': 15
});
});
// temporarily disable end time

（function（）{

(function() {

这篇关于第一次只有开始和结束时间计算工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！