如何给用户两个选择日期(每日和每月)

Question

我需要为用户提供选择开始和最终日期的选项，我正在使用日期选择器，但也可以选择开始和最后一个月的选项，然后需要作为DD/MM/YYYY提交。我正在考虑使用一个下拉菜单，在日期选择器和输入日期的其他方式之间发生变化，但问题是，我认为用户选择的任何选项都需要在相同的ID(?)下提交，这是由网站根据所选择的时间段返回数据使用的。到目前为止，该网站可以使用日期选择器，但用户不能只选择一个月。我根据这个问题的第一个答案做了一个片段来说明我的想法。如果网站根据提交的时间段使用ID来显示数据，那么两个选项如何工作?

$(document).ready(function(){
$('#purpose').on('change', function() {
if ( this.value == '1')
{
$("#day").show();
$("#month").hide();
}
else
{
$("#day").hide();
$("#month").show();
}
});
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id='purpose'>
<option disabled selected value> -- escolha o tipo de dado -- </option>
<option value="0">Dado mensal</option>
<option value="1">Dado diário</option>
</select>
<div style='display:none;' id='day'>Dado diário<br/>&nbsp;
<br/>&nbsp;
<input type='text' class='text' name='day' value size='20' />
<br/>
</div>
<div style='display:none;' id='month'>Dado mensal<br/>&nbsp;
<br/>&nbsp;
<input type='text' class='text' name='day' value size='20' />
<br/>
</div>

Answer 1

我不确定是什么类型的ID，有很多可能的配置。这只取决于你想要什么。检查每日和每月的差异(根据我的理解)。

Ps:用jQuery试试，这里行不通

const day = 18 // can be any
const excludeAllDaysExceptOne = date => (date.getDate() === day ? [true, ''] : [false, ''])
changeDaily = {
changeMonth: true,
changeYear: true,
dateFormat: 'dd/mm/yy'
}
changeMonthly = {
changeMonth: true,
changeYear: true,
dateFormat: 'dd/mm/yy',
beforeShowDay: excludeAllDaysExceptOne
}
$("#mySelect").change(() => {
$('#datepicker').datepicker('setDate', null);
const x = document.getElementById("mySelect").selectedIndex;
if (x === 1) {
setType(changeDaily)
}
if( x === 2 ){
setType(changeMonthly)
}
$("#datepicker").removeAttr("disabled")
})
function setType(type){
$(function() {
$("#datepicker").datepicker(type);
})
}

<p>Choose your input type
<select id="mySelect">
<option disabled selected>--Choose--</option>
<option>Daily</option>
<option>Monthly</option>
</select>
<br>
<p>Date: <input disabled type="text" name="datepicker" id="datepicker"></p>