javascript - 使用按钮插入时间取决于单击的字段？

Question

我有 5 个字段，我想在单击字段(或单击按钮)时自动插入时间(24 小时格式)，而不是有 5 个按钮，我想全部显示 1 个。

我使用的代码是

<input type="text" value="" id="time-holder">
<input type="button" value="time" name="timer" id="time">

知道我怎样才能做到这一点吗？

$(function(){
    $('#time').click(function(){
        var time = new Date();                
        $('#time-holder').val(time.toTimeString());  
    });
});

在 https://jsfiddle.net/cuva5y4z/

Answer 1

使用toLocaleTimeSTRing根据需要设置时间格式。例如，通过忽略秒，并在 toLocaleTimeString() 的 options 参数中执行 hour12: false，时间将读取为 17:28 .

<小时/>

对于一个输入:

$(function() {
    $('#time').click(function() {
        var time = new Date().toLocaleTimeString([], {hour: '2-digit', minute:'2-digit', hour12: false});
        $('#time-holder').val(time);
    });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" value="" id="time-holder">
<input type="button" value="time" name="timer" id="time">

<小时/>

对于多个输入 - 将一个类应用于您想要影响的所有输入，并按类定位它们。

    $('#time').click(function() {
        var time = new Date().toLocaleTimeString([], {
            hour: '2-digit',
            minute: '2-digit',
            hour12: false
        });
        $('.time-input').val(time);
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="button" value="FILL ALL INPUTS" name="timer" id="time"><br><br>

    <input type="text" class="time-input" id="time-holder1"><br>
    <input type="text" class="time-input" id="time-holder2"><br>
    <input type="text" class="time-input" id="time-holder3"><br>
    <input type="text" class="time-input" id="time-holder4"><br>
    <input type="text" class="time-input" id="time-holder5"><br>