javascript - 时间输入向上箭头上的keyup

Question

我希望#End 的值始终等于#Start 的值，即使有人只是在#Start 上进行键盘操作而没有释放鼠标也是如此

// method 1 : this works only with on change not with keyup
$('#start').change(function() {
    $('#end').val($('#start').val())
})

// method 2 : this does not work with keyup at all, donno why
$(document).on('keyup', '#start', function() {
    $('#end').val($('#start').val())
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="time" id="start" value="00:00">
<input type="time" id="end" value="00:00">

这怎么可能？

Answer 1

使用 input 事件或绑定(bind)所有你想让它监听的事件(等同于 input-event 但我认为它更跨浏览器可靠):

//input event
$(document).on('input', '#start', function() {
    $('#end').val($('#start').val())
});

//all events
$(document).on('change keyup keydown keypress click blur', '#start1', function() {
    $('#end1').val($('#start1').val())
});

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

    <input type="time" id="start" value="00:00">
    <input type="time" id="end" value="00:00">
    <br><br>
    <input type="time" id="start1" value="00:00">
    <input type="time" id="end1" value="00:00">

我更喜欢 input 事件，因为它会在每次更改时更新，但正如我所说，跨浏览器......