Question

我有以下代码：

    $('#input_hours1').keyup(function() {
      $('#input_hours2').val($('#input_hours1').val()); 
    });

    $('#input_minutes1').keyup(function() {
      $('#input_minutes2').val($('#input_minutes1').val()); 
    });

所以基本上我有4个输入框：

2表示开始时间（小时，分钟）

2表示结束时间（小时，分钟）

上面的代码将起始值复制到结束值。

如何在结束日期分钟输入框（#input_minutes2）中添加30，并在#input_hours2为31或更大的情况下增加#input_minutes2？有人可以添加一个jsFiddle吗？

例如：

Starting time hour : 1
Starting time minutes: 31
Ending time hour :2
Ending time minutes: 01

Startimg time hour: 1

Starting time minutes: 30

Ending time hour: 2

Ending time minutes: 00

Answer 1

使用纯JS的那个：

<html>
<script>
    function getm()
    {
        var smin=document.getElementById('smin').value;
        var ssec=document.getElementById('ssec').value;
        for(i=0;i<30;i++)
        {   
            if(ssec==59)
            {
                ssec=0;
                smin++;
            }
            else
            ssec++;
        }
        document.getElementById('emin').value=smin;
        document.getElementById('esec').value=ssec;
    }
</script>
<body>

Start Time: <input type="text" id="smin" onkeyup=getm()><input type="text" id="ssec"onkeyup=getm()></br>
End Time: <input type="text" id="emin" ><input type="text" id="esec">
</body>
</html>

DEMO

使用jquery的那个：

<html>
<script src="jquery-1.11.1.js"></script>
<script>
$(document).ready(function(){

var hours;
var mins;
function calc()
    {

        for(i=0;i<30;i++)
        {   
            if(mins==59)
            {
                mins=0;
                hours++;
            }
            else
            mins++;
        }

    }
$('#input_hours1').keyup(function() {

    hours=$('#input_hours1').val();
    mins=$('#input_minutes1').val();
    calc();
      $('#input_hours2').val(hours); 
      $('#input_minutes2').val(mins);  
    });

    $('#input_minutes1').keyup(function() {
      mins=$('#input_minutes1').val();
      hours=$('#input_hours1').val();
        calc();
        $('#input_hours2').val(hours); 
      $('#input_minutes2').val(mins);  
    });
});

</script>
<body>

Start Time: <input type="text" id="input_hours1"><input type="text" id="input_minutes1"></br>
End Time: <input type="text" id="input_hours2" ><input type="text" id="input_minutes2">
</body>
</html>

DEMO

Answer 2

您可以使用parseInt()方法将字符串转换为整数。这是fiddle

 $('#input_minutes1').change(function() {debugger;
        var inputmin=$('#input_minutes1').val();
        if(parseInt(inputmin)>=30){
            $('#input_hours2').val(parseInt($('#input_hours1').val())+1);
            var minutes= parseInt($('#input_minutes1').val())+30;
            if(minutes>=60)
                $('#input_minutes2').val(minutes-60);
       }
        else{
        $('#input_hours2').val($('#input_hours1').val());
            $('#input_minutes2').val(parseInt($('#input_minutes1').val())+30);
        }

    });

Answer 3

这是非常简单的逻辑，只是实现一个if来检测我们是否需要增加小时。您需要validate使用户添加text而不是数字。

$('#input_hours1, #input_minutes1').keyup(function () {
    startHours = parseInt($('#input_hours1').val(), 10);
    startMinutes = parseInt($('#input_minutes1').val(), 10);
    if (startMinutes >= 30) {
        endHours = startHours + 1;
        endMinutes = startMinutes - 30;
    } else {
        endHours = startHours;
        endMinutes = startMinutes + 30;
    }
    $('#input_hours2').val(endHours);
    $('#input_minutes2').val(endMinutes);
});

演示：http://jsfiddle.net/robschmuecker/4uR2W/

如何在此表单字段值中添加30？

3 个答案: