Question

再次需要你的帮助。我没有任何代码片段。

以下是我的问题描述：有两个文本框。在一个文本框中，用户将以24小时格式输入任何时间，例如23:23或10:12 ..

现在我需要根据输入的时间在第二个文本框中填充时间。将24小时格式的6小时添加到输入的时间后，第二个文本框应显示值。应显示05:23或16:12等等。

<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script>
 $(document).ready(function() {
$('#new_one').on('change',function (e) {
        var first_time = $(this).val();
        var arr = first_time.split(':');
        var hrs = arr[0];

        var new_hrs = parseInt(hrs)+6;
        if(new_hrs>24)
        new_hrs = new_hrs-24;

        if(new_hrs < 10) 
        new_hrs  = '0'+new_hrs;

        var second_time = new_hrs+':'+arr[1];


        $('#new_two').val(second_time);

});
 });
</script>
</head>
<body>
Text1<input type="text" id="new_one"><br/>
Text2<input type="text" id="new_two">
</body>
</html>

Answer 1

以下是工作小提琴： Working Fiddle

 $('#one').on('change',function (e) {
        var first_time = $(this).val();
        var arr = first_time.split(':');
        var hrs = arr[0];

        var new_hrs = parseInt(hrs)+6;
        if(new_hrs>24)
        new_hrs = new_hrs-24;

        if(new_hrs < 10) 
        new_hrs  = '0'+new_hrs;

        var second_time = new_hrs+':'+arr[1];


        $('#two').val(second_time);

});

使用':'分割.split(':')上第一个框的输入字符串非常基本，并相应地增加小时数并将计算值放到第二个框

Answer 2

   $(document).ready(function()
    {
       $("#firstTime").keypress(function(){
        var firsttime = $(this).val();
        var gettime = $.trim(firsttime).split(":");
        var updatetime = parseInt(gettime [0])+6;
        if(updatetime > 24)
        {
           updatetime = updatetime-24;
        }
        if(updatetime < 10) 
         {
          updatetime  = "0"+updatetime;
         }
        $("#secondtime").val(updatetime+":"+gettime [1]);
       });
   });

您的HTML将在哪里：

  <input type="text" id="firsttime"><!-- first time -->
  <input type="text" id="secondtime"><!-- second time -->

Answer 3

您还可以利用DateJS来简化计算，如下所示。这是JS Fiddle中的一个例子。请注意，没有验证检查，添加的小时数在6处硬编码。

<!DOCTYPE html>
<html>
<head>
    <title>Time Sample</title>
</head>
<body>
Start Time: <input id="startTime" type="text" /><br />
End Time: <input id="endTime" type="text" />

<script src="Scripts/jquery-1.8.2.js"></script>
<script src="Scripts/date.js"></script>
<script>
   $(function () {
        $("#startTime").change(function () {
           var endTime = Date.parse(this.value).add(6).hours();
           $("#endTime").val(endTime.toString("H:mm"));
        });
    });
</script>
</body>
</html>

如何根据使用java脚本或JQuery在一个文本框中输入的时间在其他文本框中填充更新时间

3 个答案: