Question

我正在做一个小项目，我计算开始时间，结束时间和休息时间，它将返回我工作了多少小时。我的目标是在更改StartTime，EndTime和BreakTime的值时禁用 workingHours 文本输入，使其自动更新。

这是我的脚本如何计算时间：

$(function() {
    $('#startTime').change(function() { CalculateTime(); });
    $('#endTime').change(function() { CalculateTime(); });
    $('#breakTime').change(function() { CalculateTime(); });
    CalculateTime();
});


function CalculateTime() {
    try {
        var startTime = $('#startTime').val();
        var endTime = $('#endTime').val();
        var breakTime = $('#breakTime').val();

        var startDate = new Date(2000, 1, 1, startTime.substring(0, 2), startTime.substring(3, 5), 0, 0);
        var endDate = new Date(2000, 1, 1, endTime.substring(0, 2), endTime.substring(3, 5), 0, 0);

        var time = endDate - startDate;
        time = time / 1000 / 60 / 60;
        time = time - breakTime.substring(0, 2);
        time = time - (breakTime.substring(3, 5) / 60);
        $('#workedHours').html(time + " timmar");
    } catch (err) {
        $('#workedHours').html("---");
    }
}

这是视图

<div class="form-group">
    <label class="col-md-4 control-label">Start tid:</label>
    <div class="col-md-5">
        @Html.TextBox("startTime", Model.Times.StartTime, new { @class = "form-control timepicker timepicker-24" })
    </div>
</div>
<div class="form-group">
    <label class="col-md-4 control-label">Slut tid:</label>
    <div class="col-md-5">
        @Html.TextBox("endTime", Model.Times.EndTime, new { @class = "form-control timepicker timepicker-24" })
    </div>
</div>
<div class="form-group">
    <label class="col-md-4 control-label">Rast Längd:</label>
    <div class="col-md-5">
        @Html.TextBox("breakTime", Model.Times.BreakTime, new { @class = "form-control timepicker timepicker-24" })
    </div>
</div>
<div class="form-group">
    <label class="col-md-4 control-label">Tid jobbad:</label>
    <div class="col-md-5">
        @Html.TextBox("workedHours", Model.Times.WorkedHours, new { @class = "form-control timepicker timepicker-24" })
    </div>
</div>

任何指导都会非常有用。

Answer 1

试试这个JsFiddle：https://jsfiddle.net/gt1cr0sz/2/

添加属性

disabled="disabled"

到文本框工作时间。

如何自动更新文本输入asp.net

1 个答案: