当 input[type=date] 接收到值时，如何显示元素？

Question

我正在尝试构建一个渐进式表单，但是当标准日期选择器收到一个值时，我找不到显示其他表单字段的解决方案。我发现的所有解决方案都涉及超出我的要求和理解的日期验证或条件逻辑。

我已经成功地揭示了带有 :checked 无线电输入的元素，但是有没有类似的东西可以用于日期输入？ jQuery 也是可以接受的，因为我已经在使用它来限制选择过去的日期。

$(function(){
 var dtToday = new Date();
 var month = dtToday.getMonth() + 1;
 var day = dtToday.getDate();
 var year = dtToday.getFullYear();
 if(month < 10)
 month = '0' + month.toString();
 if(day < 10)
 day = '0' + day.toString();
 var maxDate = year + '-' + month + '-' + day;
 $('#date').attr('min', maxDate);
});

.when, .form {display:none;}
input:checked ~ .when {display:block;}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>

<h4>Are you sending or receiving?</h4>
<input type="radio" id="sender" name="clienttype"><label for="sender">Sending</label>
<input type="radio" id="receiver" name="clienttype"><label for="receiver">Receiving</label>

<div class="when">
 <h4>When?</h4>
 <input type="date" id="date" name="Date">
</div>

<div class="form">
 Extra form fields go here
</div>

Answer 1

您可以尝试使用 jQuery change() 事件来获取日期更改时的值

$('#date').change(function() {
    let date = $(this).val();
    console.log(date);
});